Advertisements
Archive | jQuery hover animations RSS for this section

MultiLevel Menu


A simple multilevel menu with delayed item animations and an optional breadcrumb navigation and back button.

multi-level menu with delayed item animations and an optional breadcrumb navigation and back button.

Today’s Blueprint is a simple menu with multiple levels. The idea is to animate each menu item once a level is changed. The animation starts with the item clicked and the delays are propagated through the neighbors. The animation delays follow the same logic for the incoming items of the new level of the multi-level menu. As optional elements we have a breadcrumb navigation and a back button (not shown in our demo). Deeper levels are referenced with a data attribute. We have added some example media queries for a mobile menu version with a menu toggle. We’ve also provided a simple callback example.

The icons used in the demo are from the Organic Food icon set by Wojciech Zasina and the Feather icon setby Cole Bemis.

 

Read more

Demo

Advertisements

Animating Menu Icon with Segment


Animating Icon with Segment

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 “ninja” effect. The animation is reversed when you click on the close icon which turns it into the initial hamburger icon again. Take a look:

Read more

demo

download

Canvas Slider With Prism Effect


jquery canvas slider

Canvas Slider with prism effect

Canvas Slider With Prism Effect with free download source,

A tutorial on how to create a slider with a “prism” effect using HTML5 canvas globalCompositeOperation and a layering technique. Today we’d like to show you how to build a simple slider with an interesting “prism” effect. The idea is to place a shape in front of the slider and “reflect” the images of each slide, in order to create the illusion of a prism. We’ll be using the HTML5 canvas element and plain JavaScript.

Read more
Demo
Download

jQuery image gallery plugin free download


free jquery banner plugin

jQuery web banner

Demo

Download

jQuery web banner free download, Its simple just try it.

This plugin is SEO compliant, so the statement of the slideshow elements is only in HTML.
If you wish, you can add one or more sliders on a same page.

jQuery Flip Book Gallery


flip book gallery

flip book animation

Read more

Demo

Download

Flip book animation,
A “look inside” book preview with BookBlock. A concept for book showcases or online book stores that shows a grid of books with the options to view the details and to look inside of the book, opening the BookBlock in fullscreen and allowing for a 3D page navigation.

Thumbnail Animation Gallery


jquery thumbnail animation gallery

jquery thumbnail animation gallery

This Thumbnail Image Animations are certainly great entities for playing with fancy effects and today we’d like to show you some inspiration for thumbnail effects using CSS thumbnail image animations.

Read more

Demo

Download

jQuery parallax Background Image Animation Plugin


image jquery parallax animation plugin

jquery parallax animation plugin

Parallax Image Scroll Animation is a simple and easy jQuery plugin for creating image parallax effects when scrolling the page, inspired by Spotify.com.

Read more

Demo

Download

More Examples

Circular Image Galleries With jQuery


jQuery Circular Image Galleries

Circular Image Galleries With jQuery Plugin

Read more

Demo

Download

How To Create Circular Image Galleries With jQuery?

This is great for providing an experience users are used to, but there are a few interesting alternatives that you may like to hear about – how about displaying your images or items around a shape like a circle or an ellipse instead?

jQuery Animation Menu


jquery animation menu

animation menu

Demo

Download

jQuery animation wheel Menu by Pete R.
Add a fully customisable Path-like wheel menu button to your website.

jQuery Animation Menu


web animated menu

jQuery animation menu

Read more

Demo

Download

An experimental jquery flipping menu with animation.

This menu will open by pushing the website content to the right. It has multi-level functionality, allowing endless nesting of navigation elements.