@font-face Custom Web fonts

Another variant of @font-face CSS that I should keep note of

@font-face {
font-family: ‘MyWebFont';
src: url(‘webfont.eot’); /* IE9 Compat Modes */
src: url(‘webfont.eot?#iefix’) format(‘embedded-opentype’), /* IE6-IE8 */
url(‘webfont.woff’) format(‘woff’), /* Modern Browsers */
url(‘webfont.ttf’) format(‘truetype’), /* Safari, Android, iOS */
url(‘webfont.svg#svgFontName’) format(‘svg’); /* Legacy iOS */


jQuery: Creating instances with Javascript

I have been creating instances of objects using Flash Actionscript all this while and yet I have not tried the same application on jQuery/Javascript. Having found some little time to experiment on it and this is an example I managed to try.

The example below dynamically creates 10 div elements and randomly set their coordinates around. One of them is then called by invoking the instance’s function and allocate it to a specific location.

I believe there is a more elegant way to implement this example and if you have a better way than what I’ve done, feel free to educate me. : )

Click here to see the script in action via jsFiddle

Timelapse in a residential kitchen

Another experiment on the timelapse and the photoshoot was done at my colleague’s kitchen. This time, it’s rendered under 24 frames per second hence the motion is smoother.

Post production for the photos are edited in Adobe Photoshop CS4 under video mode. I didn’t have Adobe Premiere but the Photoshop CS4 seems to support timelapse and able to perform simple video editing. Final product is rendered with VirtualDub with Xvid compression. Motion blur is added post production. I have yet to full grasp the concepts to perform the perfect motion blur. Let’s hope I can make it happen on the next timelapse photoshoot