Submit your widget
170
Yays

Creating a Rotating Billboard System with jQuery and CSS

  Views 23869   downloads 4690   Slideshow & Scroller

We will use some images, CSS and jQuery to create the effect of a rotating billboard with two ads. The idea is to make one set of image slices disappear while another one (the other ad) appear. We will…

145
Yays

Micro Image Gallery Slideshow

  Views 73737   downloads 2418   Slideshow & Scroller

Here’s an improved version of the Micro Image Gallery Plugin.Added some features as suggested in the comments, specifically the auto play function, the possibility to add descriptions for each image,…

174
Yays

Pretty Simple Content Slider with jQuery and CSS3

  Views 28318   downloads 5612   Slideshow & Scroller

We will create an auto-playing content slider with jQuery and CSS3. The idea is to alter the background image and to slide in the heading and the description. By clicking on one of the menu items, the…

156
Yays

Supersized – Full Screen Background/Slideshow jQuery Plugin

  Views 28418   downloads 4395   Slideshow & Scroller

Features Resizes images to fill browser while maintaining image dimension ratio No extra whitespace, no scrollbars – the entire browser window is always filled Compatible in Firefox, Safari, Opera,…

147
Yays

Multiple Image Cross Fade with jquery

  Views 58065   downloads 6715   Slideshow & Scroller

Getting Started What we want to do first is to create mark-up for the content. Like this: <div class="container"> <img src="bmw_3.jpg" alt="" /> <img src="bmw_2.jpg" alt="" /> <img…

162
Yays

Simple Image Viewer(jQuery)

  Views 25716   downloads 4637   Slideshow & Scroller

Step 1: Create the Mark-up Here I have created two columns - for navigation and output. For the sake of simplicity I use attribute rel for links to find corresponding image by id in output section.  …

143
Yays

Slide Thumbs

  Views 22203   downloads 4134   Slideshow & Scroller

Step 1: Create the Mark-up First we add container elements for output. The outer-most container is used to decorate the output with a background image and padding. The next container is the element that…

234
Yays

Apple-style Slideshow Gallery With jQuery

  Views 28474   downloads 5333   Slideshow & Scroller

We are making an Apple-like slideshow gallery, similar to the one they use on their website to showcase their products. It will be entirely front-end based, no PHP or databases required. So go ahead and…

278
Yays

Slideshow Feature List

  Views 60628   downloads 12915   Slideshow & Scroller

Using Feature List requires a simple function call: $.featureList( $("#tabs li a"), $("#output li"), { start_item : 1 } ); // Alternative $('#tabs li a').featureList({ output : '#output li', start_item…

193
Yays

Making a Mosaic Slideshow With jQuery & CSS

  Views 35170   downloads 4390   Slideshow & Scroller

  We are making a jQuery & CSS mosaic gallery. Mosaic, because it will feature an interesting tile transition effect when moving from one slide to another. Step 1 – XHTML   The mosaic…

249
Yays

Slideshow plugin for the Tabs with jquery

  Views 57979   downloads 9477   Slideshow & Scroller

HTML coding The HTML setup is similar to the normal tab setup except that we have the "next" and "prev" action buttons available and the tabs are placed below the panes. <!-- "previous slide" button…

355
Yays

Multi-purpose slideshow(text scroller,images scroller) jquery plugin

  Views 60042   downloads 7081   Slideshow & Scroller

Help Step1:include css and js files.   <script type="text/javascript" src="js/jquery.js"></script> <link href="css/webwidget_slideshow_common.css" rel="stylesheet"…

338
Yays

Dot Slider - simple easy-to-use images slideshow jquery plugins

  Views 117578   downloads 24483   Slideshow & Scroller

Step1:include css and js files. <script type="text/javascript" src="js/jquery.js"></script> <link href="css/webwidget_slideshow_dot.css" rel="stylesheet"…

295
Yays

Featured Content Slider Using jQuery

  Views 60459   downloads 13057   Slideshow & Scroller

Add JavaScript Files <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" ></script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.5.3/jquery-ui.min.js"…