10 jquery animation menus: plug-ins and tutorials

Source: Internet
Author: User
Tags mootools

Jquery is a very easy-to-use javascript framework with good scalability. Using jquery can easily implement ajax effects on some pages. This article collects a batch of plug-ins and Tutorials that use jquery to implement the cool animation effect menu.

Plug-in LavaLamp

I believe many people have seen this cool menu plug-in, and many websites have successfully applied this plug-in.

Plug-in Homepage

Jquery Kwicks plugin

If you know more about Mootools, you may notice a sliding menu on the homepage of the previous version of Mootools (which you cannot see now ). This plug-in comes from this effect, which is cool and easy to customize. By using this plug-in, you can not only make personalized menus, but also make some step demos-for example, the demo of the shopping process. Plug-in Homepage

View demo | download

Mac-like dock menu plug-in

This is a jQuery plug-in that imitates the dock menu of an Apple machine. It supports both horizontal and vertical. View the plug-in page.

View demo | download

Jquery sliding menu

A menu similar to LavaLamp, and the script is less than 1 kb (lavalamp is also so small), it is easier to use. The principle of this menu is to make it more appropriate by following the current ul element (or "after ?) Add an additional div and use position to locate the div. Then, jquery and INS are used to control the size and position of the div and achieve the animation effect.

View demo | download

Tutorial CSS Sprites2-use jquery to create an animation menu

Alistapart, a well-known blog on CSS Sprites, has played a very important role in the popularization of CSS Sprites technology. The purpose of this article is to introduce the javascript-based CSS Sprites technology. It is only explained through the example of making an animation menu. It is worth reading. View tutorial

View demo

Use jQuery's animation menu

How to Use CSS and jquery's animate () function to change the background color transparency (opacity) to implement an animation menu is detailed. It doesn't matter if you cannot understand English, you can understand the code in the tutorial. View tutorial

View demo

Use CSS and jquery to create a cool animated navigation menu

A tutorial launched by Nettus,Very detailedDescribes how to use CSS and jquery to create menus with cool animation effects. View tutorial

View demo | download source file

CSS Dock Menu

A tutorial from the www.ndesign-studio.com that uses CSS to create a dock menu, using the jquery machine FishEye plug-in. View tutorial

View demo | download

Use jquery to make smooth animation navigation

A very good navigation effect. This tutorial describes in detail how to create this menu. The easing component of jquery is used. View tutorial

View demo | download

Use jquery to implement animated background images

This is a tutorial. The author combines the CSS Sprites2 tutorial mentioned above with the jquery background animation plug-in to achieve an effect. This is very good and cool. View the tutorial.

View demo | download

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.