Home > Animation (page 5)


Animated Map Path for Interactive Storytelling

Today we’d like to share an experimental demo with you. This demo is an interactive map that will animate a map path while scrolling the page. The main idea is to connect the story being told with the path itself. The journey can also contain images that will indicate where …

Read More »

Material Design Slider Animation with CSS3

A Material Design inspired slider with effective communicating animations.Communication design is a mixed discipline between design and information-development which is concerned with how media intermission such as printed, crafted, electronic media or presentations communicate with people.

Read More »

Animating SVG Menu Icon with Segment

Today we are very happy to share an interesting menu icon effect with you. The idea is based on the Dribbble shot hamburger menu by Tamas Kojo. At first, the icon is the classic burger menu icon.But when you click on it, it becomes a close icon with a fun …

Read More »

Interactive Room Display with JavaScript & CSS

Today we’d like to share a little experiment based on a Dribbble shot by Bilal Mechairia’s, called “Spaces”. The idea is to show an interactive room with several items that all float in 3D space and move according to the position of the mouse. Once an item is clicked, more …

Read More »

Squeezebox Portfolio Template in CSS & jQuery

An intro block that slides out to uncover a gallery of portfolio items. We’ve been experimenting with some motion effects to build a simple portfolio template. The idea is to show a gallery of projects as a separate, secondary module, with the first block still partially visible – just one …

Read More »

jQuery DrawSVG

jQuery DrawSVG is lightweight, simple to use jQuery plugin to animate SVG paths.  This plugin uses the jQuery built-in animation engine to transition the stroke on every <path> inside the selected <svg> element, using stroke-dasharray and stroke-dashoffset properties.

Read More »