Mootools CSS3 transitions script
I'm quite busy with a sort of webapplication with a lot of fade animations. In an attempt to speed up those animations I tried CSS3 animations (dropping the fps and use a linear transition didn't help). Afterwards it seemed to perform a lot better in (especially) Safari. I made the script work for Opera, Webkit browsers and a future version of Firefox (i'm using 3.5.9). If the browser isn't supported, the script automatically switches back to a normal Mootools transistion.
If you want to try the script you can download it here. You can use .tween and .fade, just replace the first letter to a capital (like: .Tween). Not everything is working yet, just look in the source for further information.I didn't test anything accept my own webapplication, so use it at your own risk!You can see a very (very) basic demo here:CSS3 transition demo
I made this script for a webapplication (also the advanced demo), you can check it out here:
Archive of moments(dutch)
Blog item about the archive of moments
Download zipped version here:
css3-transitions.zip
Please note me if you like it and you're using it (it's free to use and adopt upon and do whatever you like with it, but i like to know)!
If you don't like my implementation, check out the script of André Fiedler here: Mootools Forge Fx.Tween.CSS3 (i found this after writing my own script, i used a snipped of him found on the web and used it in my script). I use .tween and .fade very frequently, so that's why i prefer my script more (didn't try André's script yet).


Comments [4]