Jan 172013


Karl Schellenberg demonstrates how to stagger full-site animations with CSS3 and JavaScript through page scrolling

When we redeveloped our new website, we decided to use CSS3 animations to provide an impressive and interactive site experience. However, we struggled to time the animations to trigger at the right time.

Because animated elements “below the fold” (depending on the screen resolution) animate on page load, some animations had already played before the user had chance to scroll to them.

To prevent this, we delay the animations until the user can see them. The animations trigger as the user scrolls down and the elements come into view, which creates a staggered effect. To do this we used specific classes for CSS3 Transitions and some JavaScript to trigger the correct elements during scrolling.

MORE:  Getting CSS animations to trigger at the right time




Oct 102011



Google debuted an “early preview” version of a programming language called Dart today for building Web applications in the way JavaScript is used right now.

Programmer Lars Bak detailed the project in a talk today at the Goto conference conference today in Denmark and in a blog post. In it, he said Dart is geared for everything from small, unstructured projects to large, complicated efforts.

via Google debuts Dart, a JavaScript alternative | Deep Tech – CNET News.

Aug 252011



According to jQuery support, training and consulting company appendTo, the popular open source library has now ‘overtaken’ Flash, in terms of how many websites have deployed each technology, at least when it comes to the world’s ‘top’ websites.

via jQuery overtakes Flash | News | .net magazine.