Effects

68 articles

Create Visually Stunning Presentations With CSS3 Transitions: Impress.js

Impress.js is a presentation framework based on the power of CSS3 transforms and transitions in modern browsers. It helps you to create visually stunning presentations with CSS3 awesomeness. Currently impress.js works fine in latest Chrome/Chromium browser, Safari 5.1 and Firefox. As it was not developed with mobile browsers in mind, it currently doesn't work on any mobile devices, including tablets.…

Add Parallax Scrolling Effects to Any Element: Stellar.js

Stellar.js is a jQuery plugin that adds parallax scrolling effects to any scrolling element. Parallax has never been this easier, add some simple data attributes to your markup, run $.stellar(). That's all you need to get started. Mobile Safari halts code execution during scroll so you can't use normal scroll events to animate. By using an iOS scrolling library (Scrollability)…

Scrollorama Makes Scrolling Fun and Interactive

Scrollorama is a jQuery plugin that makes scrolling on your site fun and interactive. It helps you design and build your site by dividing and handling your content into blocks. Major effects and transitions are as follows: Fading in / out Flying Rotation Zooming in/out Parallax [rss]Special Downloads[/rss] [rss]Design Freebies[/rss] [rss]Feedback Collection and Polling Widget[/rss] [rss]Free Creative Resume Template[/rss] [rss]Open…

Awesome Text Transitions: Textualizer

Textualizer is a jQuery plug-in which offers awesome text transitions. It allows you to transition through blurbs of text, when transitioning to a new blurb, any character that is common to the next blurb is kept on the screen, and moved to its new position. [rss]Special Downloads[/rss] [rss]Design Freebies[/rss] [rss]Feedback Collection and Polling Widget[/rss] [rss]Free Creative Resume Template[/rss] [rss]Open Source…

Cloud-based HTML5 Animation Platform: Mugeda

Mugeda is a cloud based HTML5 animation platform, where you can create, share, and publish organic HTML5 animation contents, all in your browser, without any download or installation. The created animation content can be used in a wide range of applications like ads, games, tutorials, cartoons, and can be viewed on any devices including PC, smartphone, and tablets. [rss]Special Downloads[/rss]…

Circular Path Menu in Pure CSS3

A very nice circular path menu developed using pure CSS3. This path menu is completed built with only HTML / CSS3, no images and no JavaScript. To calculate the coordinates of items and generate the animation, author used Sass+Compass, a math formula in order to add the item's position on the arc of circle and generated keyframe animation for each…

Create Amazing Animations with JavaScript: Paper.js

Techniques  and methods for rendering animation in web browsers have evolved interestingly from GIF images to Flash and then from JavaScript to HTML Canvas element. The later is, without an iota of doubt, the most effective and futuristic especially in this era of tablets and smart phones that are not powerful enough to render 'bulky' animations at the cost of…

JavaScript Canvas-based Advanced Animation Toolkit: CAAT

Canvas Advanced Animation Toolkit (CAAT) is a JavaScript canvas based animation scene graph manager. It is able to render using Canvas, WebGL and CSS with the same code base. CAAT in essence is a multi-instance director-based scene graph manager. It is multi-instance in the sense that you can set an undefined number of directors up for each web page. Each director…

CSS3 Transformations and Transitions for jQuery: jQuery Transit

jQuery Transit is a plugin which helps you do smooth CSS3 transformations and transitions in jQuery. You can set transformations as you would any CSS property in jQuery. jQuery Transit degrades older browsers by simply not doing the transformations (rotate, scale, etc) while still doing standard CSS (opacity, marginLeft, etc) without any animation. [rss]Special Downloads[/rss] [rss]Design Freebies[/rss] [rss]Feedback Collection and…

JavaScript Animation Framework: jsMorph

jsMorph is a pure JavaScript animation framework that can manipulate almost any and multiple styling of multiple HTML elements. It auto detects start positions, auto converts units, automatically adjusts rendering speed and corrects time leaks for smoother rendering experience. Even if used for queued multiple elements, jsMorph can do single or grouped triggering as well as handling plenty of unique…