Wouter Beugelsdijk's techblog - tech.wiedo.nl

webdevelopment and other tech related stuff 
Tags


Filed under

mootools

 
11 June
 

Archive of moments webapplication

Prtscr_capture

I'm currently busy with the technical part of my girlfriend graduation project: 'Archive of Moments'.

A part of this archive is an online search application (this is the webapp i noted working on in my last post).
If you're interested, take a look here: Archive of Moments.

Beware, it does make a lot of use of modern webtechnologies (CSS3 styling and animation). So update your browser and preferably open it in Apple's Safari (5) browser for the best performance! It does make use of progressive enhancement though, so it should also work in older browsers, but i didn't test this at all. It's also in dutch language, but you can still experiment.

If you've found bugs or have some tips, please notice me via the comments.

The other technical part of the project is also interesting, you'll hear from it soon (hint: it does make use of an Arduino and RFID chips).

Filed under  //   Youtube API   css3   mootools  

Comments [0]

25 May
 

Mootools CSS3 transitions script

Screen_shot_2010-05-24_at_6

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).

Filed under  //   CSS3   mootools   script   transition  

Comments [4]