Sliding Boxes and Captions with jQuery
All of these sliding box animations work on the same basic idea. There is a div tag (.boxgrid in my css) that essentially acts as a window where two other items of your choosing “peek” through. From this basic idea we can play around with animations of the sliding element to either show or cover up the viewing area, thus creating the sliding effect.
jQuery image slide on hover effect
This is a simple technique to animate an image when hovering using jQuery’s animate() effect. We will use this effect to manipulate our CSS, creating a seamless transition between two areas of an image. Have a look at the demo below for a better understanding.
Longer Captions for jQuery’s FancyBox Plugin
jQuery’s FancyBox Plugin has been a huge hit and is now being used in a lots of websites. But still there is something that is missing in it. That something is the “Longer Captions”. FancyBox allows only short captions, in short it could turn out to be a bad option for the ones who need to provide longer and bigger captions.
Over here you will get an improvised version of the jQuery’s FancyBox
This version of FancyBox has been modified to handle captions in a more interactive way. It also doesn’t break on excessively large captions. This example is based on FancyBox 1.2.1.
jQuery’s Star Rating Widget
What is this?
The Star Rating widget is a plugin for the jQuery javascript library that creates a non-obstrusive star rating control based on a set of radio input boxes or select options.
What it does?
* It turns a collection of radio boxes / select options into a neat star-rating control.
* It creates the interface based on standard form elements, which means the basic functionality will still be available even if Javascript is disabled.
* It gives you the full access to each instance of “stars” created on the page, with an easy to use syntax provided by the jQuery UI core library.
LavaLamp for jQuery Users
As User Interface developers, we know that one of the first widgets our visitors use is a “Menu”. Capturing their attention right there is something that we always strive for, and I guess LavaLamp is a step in that direction.
Hover zoom Effect with jQuery and CSS
The hover zoom effect basically reverse zooms an image while fading in a label on top of it when the mouse hovers over it. It makes for a pretty slick effect which could be used on thumbnails. You can check out a demo or grab the source right here if you don’t want to read the entire tutorial.
Greyscale Hover Effect with CSS & jQuery
This effects would help you in making your portfolio or making portfolio websites. In this effect, with the help of CSS and jQuery, a greyscale effect comes into being on Hover
jQuery Image Zoom Plugin
The imageZoom jQuery plug-in makes it easy to show off your images in an easy and attractive manner for portfolios.
Join testking HP0-S20 online training with testking 642-481 design guides and other testking 642-426 web development products to improve your creativity and work.
I would like to share jQuery Gloss plugin
http://www.freelancer-id.com/gloss
thanks 🙂
This informal article helped me a lot! Saved your site, very excellent categories everywhere that I see here! I really like the info, thanks.
nice post. thanks.
Great post, bookmarked
Excellent jquery! If this can be implemented in WordPress, I am sure I will use it. Thanks
Nice collection of great jQuery effects to embed in web projects. Thank you.
I have similar post on my blog: http://www.net-kit.com/15-excellent-thumbnail-gallery-effects/
Thanx for informing me..
Nice collection gor gallery effects. it must be helpful..