Submit your widget
58
Yays

jQuery and CSS3 Image Flyout Slider effect

Views 17348   downloads 4320   Image Effects

This is an experimental flyout image slider. This image slider is a stack of some images and works by flying out the selected image to the front of images stack. We will use CSS3 transition, animation…

57
Yays

slide images header feature with jQuery

Views 17096   downloads 3094   Image Effects

This might not be the best way to structure the JavaScript and I’m sure you hard core coders will pick up on this however one of the purposes of this tutorial is to show newcomers to jQuery exactly…

56
Yays

Fancy CSS3 Transitions Image Gallery

Views 29535   downloads 9816   Image Effects

CSS3 Transitions allow browser to animate HTML elements through the change of CSS properties. In other words, we can create animations in webpage without JavaScript but just with pure CSS. The Idea The…

55
Yays

Responsive Image Sizes At Different Resolutions

Views 12999   downloads 2033   Image Effects

An Experiment with Mobile-First Images that Scale Responsively & Responsibly What is this? The goal of this technique is to deliver optimized, contextual image sizes in responsive layouts that utilize…

55
Yays

Portfolio image navigation slider with jQuery

Views 22133   downloads 3867   Image Effects

 The idea is to show some portfolio items in a grouped fashion and navigate through them in all 2D ways (horizontal/vertical). Either the arrows or the little boxes below the current image can be…

53
Yays

jQuery images Interactive and Filterable Plugin

Views 15794   downloads 3232   Image Effects

The plugin is configurable to work with just about any markup. Filters <ul id="portfolio-filter"> <li><a href="#all">All</a> </li> <li><a rel="design"…

50
Yays

jQuery useful preload image effect

Views 13943   downloads 1885   Image Effects

The idea is to preload an image first to browser cache, then display it when completely loaded using jQuery. We can also make it more presentable to viewers by adding a fade in effect after we preload…

45
Yays

jQuery Fullscreen Background effect

Views 24166   downloads 3584   Image Effects

If you’re a webdeveloper or designer we'll pretty sure you’ve run into the problem of people wanting to have “fullscreen content” or just background images that will stretch…

42
Yays

Auto Resize Picture - jQuery Picture

Views 17056   downloads 1588   Image Effects

  Overview jQuery Picture is a tiny (2kb) plugin to add support for responsive images to your layouts. It supports both figure elements with some custom data attributes and the new proposed picture…

38
Yays

Image black and white switch with jQuery.

Views 22699   downloads 3729   Image Effects

This plug-in can easily convert any colored image into a B&W greyscale image. It uses the the HTML5 canvas tag and a fallback for the old browsers Usage 1 Include the plug into the page: <script…

37
Yays

popular jQuery Cropping Images

Views 13320   downloads 1666   Image Effects

you just want to display a collection (or more) of images with different dimensions. The problem seems easy enough.   The task of manually creating thumbnail for each image is quite tedious and it’s…

37
Yays

jQuery images Lazy Load plugin

Views 13926   downloads 1907   Image Effects

This  is very useful and it boosts performance delaying loading of images in long web pages because images outside of viewport (visible part of web page) won't be loaded until the user scrolls…

30
Yays

Inset border effect for image or box with jquery plugin

Views 10240   downloads 2170   Image Effects

Usage Just call the plugin at the element you want to add a inset border effect. $(document).ready(function(){ $('a').borderEffect(); }); How it work? The plugin add position:relative to the element…

29
Yays

Animated Photo Stack with CSS3 and jQuery

Views 16784   downloads 2603   Image Effects

we are going to build an animated photo stack, which will use all kinds of fancy effects to transition between a set of images. The effects are implemented purely using CSS3, which means that they run…

29
Yays

JQUERY, HTML 5 & CSS3 GALLERY---least.js

Views 15833   downloads 4522   Image Effects

Random & Responsive jQuery, HTML 5 & CSS3 Gallery with LazyLoad use it Download least.js   Insert the following code before end of </head>-tag. <!-- least.js CSS-file --> <link…