24 ways: Flashless Animation http://24ways.org/201206
Interaction design • webdevelopment • web art • photography
24 ways: Flashless Animation http://24ways.org/201206
RT @sgalineau: I had never heard of the 'all' CSS property until today http://dev.w3.org/csswg/css3-cascade/#all
RT @neave: Very silly :) http://responsiveurl.co.uk/
confusing keyboard-using readers of your blog: trigger page nav on each press of left/right arrowkey, without checking if Alt-key is pressed
RT @paulrouget: Head tracking and 3D effect with WebRTC (works in Firefox, Chrome & Opera) http://is.gd/gqb4U4 (media.navigator pref needs to be turned on)
StackOverflow - What was the strangest coding standard rule that you were forced to follow? http://stackoverflow.com/questions/218123/what-was-the-strangest-codin g-standard-rule-that-you-were-forced-to-follow (via http://www.reddit.com/r/programming/comments/148prj/humorous_stack_ove rflow_thread_what_was_the/ )
RT @twholman: Oooh! amazingly sexy #javascript chess - http://codepen.io/juliangarnier/full/BsIih - by @JulianGarnier
RT @vasilis: Op zoek naar een alternatief voor een deel van de functionaliteit van Adobe Shadow? http://viljamis.com/blog/2012/remote-preview/
exploring the differences between android v2.3.7 and v4.1.1. glad to now play around with a mobile browser that supports 3d css transforms
RT @smashingmag: "IDs have their place in CSS as well." — In Defense of Descendant Selectors and ID Elements by @zeldman: http://www.zeldman.com/2012/11/21/in-defense-of-descendant-selectors-a nd-id-elements/
RT @csswizardry: New blog post: Code smells in CSS: http://bit.ly/URRXQd cc. @chriscoyier
RT @JoelSutherland: How responsive web designers imagine user behavior: http://i.imgur.com/YkbaV.gif
RT @jedisct1: All the crypto code you’ve ever written is probably broken: http://tonyarcieri.com/all-the-crypto-code-youve-ever-written-is-proba bly-broken
RT @newsyc20: 9 ways to use cURL everyone should know http://bit.ly/WL5jEP (http://bit.ly/WL5hwB) via @KrisJordan #trending #guru
RT @ChromiumDev: DevTools: the new console.clear() and styled console logs make for a powerful combo along with console.group: http://twitter.com/ChromiumDev/status/266256400022396928/photo/1
The NYT's visual election outcome explorer - how we made the interactive D3 decision tree http://source.mozillaopennews.org/en-US/articles/nyts-512-paths-white- house/ (via http://news.ycombinator.com/item?id=4744147 )
RT @kylebarrow: My overview of mobile overflow scrolling support, including the wobbly bits: http://barrow.io/overflow-scrolling
Non-Confusing, Visually Correct Slider Toggle UI http://www.chrisnorstrom.com/2012/11/invention-multiple-choice-windowe d-slider-ui/ (via http://news.ycombinator.com/item?id=4742535 )
RT @cubiq: once we recreated all possible objects with CSS can we start using SVG?
RT @robinberjon: The famously interoperable Device Orientation API #parisweb http://twitter.com/robinberjon/status/258847106423463936/photo/1
RT @paul_irish: Cool: recent StackOverflow question http://stackoverflow.com/q/12592473/89484 led to someone make a CSS Diff DevTools extension http://stackoverflow.com/q/12592473/89484
When in git - animated gifs for git users: http://wheningit.tumblr.com/
RT @codepo8: A clever trick to sync your Sublime Text Settings across devices using Dropbox http://stackoverflow.com/questions/11365948/how-to-save-restore-sublim e-text-2-configs-plugins-to-migrate-to-another-compute
How to Choose Colours Procedurally http://devmag.org.za/2012/07/29/how-to-choose-colours-procedurally-alg orithms/ (via @JoshuaDavis )
1.notice IE jQuery error; 2. dl slightly newer unminimized jQuery simply to debug specific line; 3. find bug has disappeared like magic, yay
RT @ppk: New blog post: Apple’s .mobi insanity http://www.quirksmode.org/blog/archives/2012/09/apples_mobi_ins.html
my previous css-only animation (iris - http://milov.nl/e/123 ) is featured on the home page of @CodePen, neato: http://codepen.io/
RT @mathias: Detailed research on GPU acceleration and `requestAnimationFrame` across browsers by @zoltandulac: http://mths.be/bjk
css fire flower on codepen: http://codepen.io/vmilo/pen/vioHE (alternate version revealing the element/shadow structure: http://codepen.io/vmilo/full/huDKn )
my phone can't show char ✽ (HEAVY TEARDROP-SPOKED ASTERISK), so fire flower becomes fire squares http://milov.nl/e/124 http://twitter.com/milo/status/249926131267026944/photo/1
made another css-only animation, 124 - fire flower: http://milov.nl/e/124
remarkable how much faster it is to run js at bottom of body instead of on document.ready, especially with 3rd party adservers in the mix
100% Client Side QR Code Reader using getUserMedia() + Webcam http://miniqr.com/docs/demo/index.html (via http://html5weekly.com/archive/53.html )
RT @troyhunt: Reddit's response headers still crack me up: http://yfrog.com/nvidppp <- wonder if they've snared anyone?!
We Are Back http://www.wab.com - classic 90s cracktros redone in js/canvas (via @threeze, @waxpancake) #demoscene
The Best Interface is no Interface - http://www.cooper.com/journal/2012/08/the-best-interface-is-no-interfa ce.html/ (via @EduardoMorais )
RT @rtfeldman: "You spent all this time coming up with ten lines of code?" "No, I spent all this time *getting it down to* ten lines of ...
RT @thomasfuchs: Responsive websites are really hard to use when you are used to the desktop version. No zooming means no non-linear access.
RT @troyhunt: Just blogged: Lessons in website security anti-patterns by Tesco http://www.troyhunt.com/2012/07/lessons-in-website-security-anti.html
fixed 123 http://milov.nl/e/123 counter-rotation on ipad by replacing (unsupported?) animation-direction:reverse with separate animation rule
A bit of jQuery I used recently for debbugging, to highlight all img-tags with missing width/height params:
$('img:not([width]),img:not([height])').css({border: '3px dashed red'})
Here's a plain js version that works without jQuery: document.styleSheets[0].insertRule('img:not([width]),img:not([height]){border: 3px dashed red}')
123 (css animation) - combined my old fave, border-style dashed, w/ border-radius 50%. Only works in Chrome, it seems: http://milov.nl/e/123
pareidoloop cleverly generates "faces" by combining random polygons, mutation, face detection: http://iobound.com/pareidoloop via http://javascriptweekly.com/archive/88.html
RT @ID_AA_Carmack: I was going to comment on use of booleans in API, and I found that it has an idiomatic name: "boolean trap": http://ariya.ofilabs.com/2011/08/hall-of-api-shame-boolean-trap.html
RT @rmurphey: What's wrong with @netmag's "Optimise your JavaScript" post https://gist.github.com/3086328 (with thanks to @cowboy @rwaldron & everyone else)
RT @Glinner: “I’d LOVE to download your app instead of going to the webpage I just tried to visit!”— No-one, ever. No-one in the future either.
RT @jsgoodies: 2d visibility; various algorithms to determine visibility in 2d games, includes live demos: http://js.gd/2qa
RT @morgan3d: Article on efficient and elegant hex and triangle grids indexing http://www-cs-students.stanford.edu/~amitp/game-programming/grids/
wtf mobile web http://wtfmobileweb.com via @brad_frost
"The British Countryside Generator, as we’re calling it, is our procedural world engine for Sir You are Being Hunted." http://big-robot.com/2012/07/02/procedural-british-countryside-generat ion/
hover effects in my css-only anim 120 http://milov.nl/e/120 now also triggered on ipad touch events, thanks to replacing div's with a's
RT @mahemoff: WordPress is so much the general-purpose CMS these days, I have to specify "blog" when searching for themes
RT @phoboslab: X-Type - Making Of http://www.phoboslab.org/log/2012/06/x-type-making-of
Just noticed a curious Javascript bug in Internet Explorer 9: the screen.width/height properties always return the dimensions of the main monitor, even when the active browser window is on the second monitor.
Upon further testing, it turns out Safari for Windows has the same problem. Chrome, Opera and Firefox all report the correct dimensions, however.
3D Thumbnail Hover Effects http://tympanus.net/Tutorials/3DHoverEffects/ via http://html5weekly.com/archive/42.html
RT @attasi: I built a CSS 3D lighting engine. It's called Photon. What do think? http://photon.attasi.com/
RT @subblue: Just uploaded a bunch of test scenes from my WebGL 3d renderer: http://www.flickr.com/photos/subblue/
RT @mathias: TIL that WebKit supports the non-standard iframe@viewsource: http://mths.be/bhn /via @0x6D6172696F
RT @sgalineau: This is how I write test assertions #testtwf http://twitter.com/sgalineau/status/213844056608997376/photo/1
RT @JSProfessor: Say goodbye to the pesky ternary operator: "[myResult1, myResult2][+myCondition];" #youreWelcome #greatForNesting
RT @keithclarkcouk: Just to see what it would look like: A 3D logo with lighting using webkit CSS masks, gradients and 3D transforms: http://jsfiddle.net/keithclark/xhFZQ/8/embedded/result/
code.flickr: Parsing Exif client-side using JavaScript http://code.flickr.com/blog/2012/06/01/parsing-exif-client-side-using- javascript-2/
RT @fabynou: Just finished Doom3 Source Code Review: http://fabiensanglard.net/doom3/index.php
RT @0xabad1dea: New rule: every website must disclose their password storage format on the signup page. Scared to disclose? It’s too weak.
RT @meyerweb: Another color visualization: “Getting HSL From RGB” (http://meyerweb.com/eric/css/colors/hsl-from-rgb.html). Not sure I like this one as much, but it’ll do for now.
Creating Fast Buttons for Mobile Web Applications https://developers.google.com/mobile/articles/fast_buttons via http://news.ycombinator.com/item?id=4083357
RT @twholman: The new twitter logo with #css - http://labs.upperdog.se/twitter-logo-in-css/ - Don't forget to mouse-over!
Testing 3 million hyperlinks, lessons learned http://samsaffron.com/archive/2012/06/07/testing-3-million-hyperlinks- lessons-learned via http://news.ycombinator.com/item?id=4077891
RT @ngauthier: needed: `console.console()` which would have the browser console print out a message comforting the developer.
RT @schill: @meyerweb Also for fun, see encoding JavaScript into PNG data: http://daeken.com/superpacking-js-demos
fun with Chrome css filter: javascript:void(deg=0,setInterval(function(){document.body.style.WebkitFilter='hue-rotate('+(++deg)+'deg)'},55))
RT @grumpygamer: Crap. I just generated a GUID I didn't end up using. I feel bad.
RT @kissane: No other professional sector of the web breaks old URLs like newspapers. Just tried to read reviews of a 12-year-old movie. Zero for six.
RT @quarkness: De achterkant van @nrcvandaag @ nrc.nl› http://instagr.am/p/LShwtUBlT7/
Distilled from the hype - hyperlinks for front-end developers http://distilledfromthehype.com/ via @distilledhype
oldskool racing game pseudo-3d rendering explained http://gorenfeld.net/lou/pseudo/ (via http://mefi.us/w/116275 )
categorizing different ways to implement 2d platform games http://higherorderfun.com/blog/2012/05/20/the-guide-to-implementing-2d -platformers/ (via http://mefi.us/w/116275 )
RT @paul_irish: A little history on three.js and @mrdoob's tale of getting into coding: https://github.com/mrdoob/three.js/issues/1960
RT @sgalineau: This srcset thing has certainly made a lot of people very responsive #seewhatididthere
RT @sgalineau: Making Sublime Text more awesome: http://opensourcehacker.com/2012/05/11/sublime-text-2-tips-for-python- and-web-developers/ (via @paul_irish)
RT @jordanmoore: Source shuffling - serving the right image for the right device using @adactio's Conditional CSS - http://www.jordanm.co.uk/post/22964442013/source-shuffling-responsive- images-based-on-media #rwd
RT @mathias: Why you shouldn’t serve content (e.g. html5shiv.js) directly from *.googlecode.com: http://mths.be/bgn
those js let's-fade-out-the-entire-page lightbox overlays and touch browsers continue to be an awkward annoying mix
Pixel-fitting – how antialiasing can ruin your logos and icons http://dcurt.is/pixel-fitting via http://news.ycombinator.com/item?id=3950740
RT @brad_frost: Use your phone to control a game played in your desktop browser! Awesome! http://jsdo.it/controller #ffly #fftweet
RT @morgan3d: Excellent random island generation algorithm, with code and derivation: http://www-cs-students.stanford.edu/~amitp/game-programming/polygon-ma p-generation/