Submit your widget
98
Yays

Animated Header in jQuery

Views 16108   downloads 2198   Image Effects

We'll show you how to animate your header’s background image using jQuery to give your website that little extra something.We are going to build a header that animates it’s background. …

94
Yays

Simplest jQuery Spotlight Effect

Views 9798   downloads 1449   Image Effects

This is a Simplest jQuery Spotlight Effect 1. HTML We will use divs instead of ul list here. I have tested it with UL before, and it will work perfectly fine, you just have to style is with CSS. The caption…

136
Yays

Useful and Practical jQuery Image ToolTips

Views 43000   downloads 13448   Image Effects

It displays a tooltip image when user hover on the thumbnail with fadein and out effect. it's a useful script for your website. 1. HTML I have been thinking of using UL list, but then I think it's not…

108
Yays

Image Highlighting and Preview with jQuery

Views 9844   downloads 1613   Lightbox & Dialog & Overlay

We will highlight images on a delayed hover and offer a preview mode which will enlarge and center the bigger version of the image on the screen. The Markup   For the HTML structure we simply need…

119
Yays

Interactive Photo Desk with jQuery and CSS3

Views 10314   downloads 1858   Image Effects

In this little experiment we created an interactive photo desk that provides some “realistic” interaction possibilities for the user. The idea is to have some photos on a surface that can…

128
Yays

Beautiful image Filterable Portfolio with jQuery

Views 21380   downloads 3115   Layout & Interface

  If you have worked in your field for a while, there is a pretty good chance that you have a rather extensive portfolio. To make it a little easier to navigate, you will probably be tempted to break…

139
Yays

Stunning Sliding Door Effect with jQuery

Views 14492   downloads 3248   Image Effects

Basically, this is what it does: Grab all the div with qitem class, find the image and replace it with four DIVs (four corners) Each of the corner will have the same background image (grabbed from qitem…

121
Yays

Image Preview Gallery

Views 19170   downloads 3705   Image Effects

Here we have a bunch of thumbnails. When each thumbnail is rolled over, script will load an image that we have linked in HREF attribute of an A tag. That makes this method accessible as well, because…

89
Yays

Thumbnail Gallery with Slick Heading and Caption Effect with jQuery

Views 11761   downloads 1921   Image Effects

This is a simple jQuery , but can be extremely useful in frontend design Similar examples 1. HTML It's simple, inside the container - photo class you have three objects, first div is the heading, image…

104
Yays

Zoom-Info – Create An Informative Image Gallery With jQuery & CSS

Views 15559   downloads 3054   Image Effects

Question: Have you ever wanted to neatly display a few lines of text about an image in your site but didn’t want to compromise on the design of your overall layout?we'll going to show you how to…

149
Yays

Interactive Picture with jQuery(Image Tips)

Views 20450   downloads 3970   Tooltips

In this tutorial I will be showing you how to piece together an interactive picture – aka an image that contains tooltips and popup boxes. This can be useful for showing off a particular aspect…

487
Yays

Reorder and filter items with a nice shuffling animation(Quicksand)

Views 45175   downloads 4453   Image Effects

How it works At the very basic level, Quicksand replaces one collection of items with another. All you need to do is provide those two sets of items. You can do it in a couple of ways: Use plain HTML,…

257
Yays

Images Or Banner Rotator With jQuery

Views 29324   downloads 3039   Image Effects

How To Use It? Step 1 – XHTML The XHTML code of the banners is generated on the fly by PHP after a database query, and outputted to the page. Here is how the markup for a sample banner looks like:…

99
Yays

Fancy Hover Effect with jQuery

Views 19968   downloads 2577   Image Effects

Very cool hover effect HTML   <div id="featured-wrap"> <div id="featured-content"> <a href="http://www.jardinesdelte.com/"><img alt="Jardines" src="2_s.jpg" /></a> <a…