Best jQuery Slider Plugins & Tutorials with Demo

    iPicture : A jQuery Plugin For Tooltip your Images With Demo

    April 3, 2012 | Drag & Drop, Gallery, jSON, Plugins, Slider, Web
    iPicture : A jQuery Plugin For Tooltip your Images With Demo

    iPicture, a jQuery plugin, is perfect for such cases and allows us to place tooltips over any desired location of images.

    Once the user hovers/clicks the pointers, the tooltip is displayed with its pre-defined content.There are several options for customizing the functionality including the ability to use different pointer images for each tooltip or their animation types.

    Also, iPicture has a handy initialize function that saves so much time by enabling a configuration wizard where we can place pointers + set their definitions with drag ‘n’ drops and the JSON output to be used in the code is created automatically.

    Read More Demo

    SliderWall : jQuery image slider with Demo

    April 3, 2012 | Gallery, HTML5, Slider
    SliderWall : jQuery image slider with Demo

    SliderWall is a jQuery slider plugin that helps you to create all types of content sliders. The plugin is entirely based on HTML5, CSS3 and JavaScript.SliderWall is a very flexible tool, meaning that you can use it to create many types of sliders, from content sliders to image sliders.

    And you don’t have to start from scratch! SliderWall offers you several different templates – along with cool transition effects – that can be customized in CSS so that they match your website’s design.

    Read More Demo

    Slidorion : jQuery Image Slider & Accordion with Demo

    April 1, 2012 | Accordion, Plugins, Slider
    Slidorion : jQuery Image Slider & Accordion with Demo

    A combination of an image slider and an accordion, the Slidorion displays beautiful images along with a variable length description. With slides linked to each tab, and accompanied by a large array of effects, the Slidorion is a great alternative to the traditional jQuery slider.

    Read More Demo

    Timeline : jQuery Storytelling Tool with Demo

    March 31, 2012 | jSON, Other API, Slider
    Timeline : jQuery Storytelling Tool with Demo

    Timeline is a JavaScript-powered tool for creating interactive storytelling timelines where a timeline works in parallel with a content slider.Users can choose to browse the contents either by clicking the items in the timeline or by navigating through the content slider where both stays synchronized all the time.

    Timeline is great for pulling in media from different sources. Just throw in a link from Twitter, YouTube, Flickr, Vimeo, Google Maps or SoundCloud and Timeline will format it to fit perfectly. More media types will be supported in the future.

    Creating one is as easy as filling in a Google spreadsheet or as detailed as JSON.

    Read More Demo

    noUiSlider : jQuery Range Slider with Demo

    March 29, 2012 | jQuery UI, Plugins, Slider
    noUiSlider : jQuery Range Slider with Demo

    noUiSlider is a little jQuery plugin that turns a html object into a nice (range) slider. It can have two handles to select a range, a fixed minimum or maximum to select a limit, or just two handles to pick some points.

    Every event in the noUiSlider has an optional callback, so you can completely control any slider interaction. There is also some cool math in the read-out functions, so you can dynamically calculate any selected value. noUiSlider is developed to provide some basic slider functionality, without having to include the complete jQuery UI library.

    Read More Demo

    Zino : jQuery Slider plugin with Demo

    March 27, 2012 | Plugins, Slider
    Zino : jQuery Slider plugin with Demo

    Zino is a Image and content slider inspired by jQuery UI source.Zino is jQuery Slider plugin, image and content slider, banner rotator with slideshow capabilities.

    Read More Demo

    jQuery Blinds Slideshow using CSS Sprites with Demo

    March 24, 2012 | Plugins, Slider
    jQuery Blinds Slideshow using CSS Sprites with Demo

    jQuery slideshow plugin blinds has following features :

    Features

    • Smooth animated transition
    • Customizable sprite grid
    • Customizable animation ochestration
    • Multiple instances on the same webpage
    • jQuery compatible (plugin)
    • Unobtrusive javascript
    Read More Demo

    Making a Giveaway jQuery Randomizer App with Demo

    March 19, 2012 | PHP, Slider, Web
    Making a Giveaway jQuery Randomizer App with Demo

    jQuery Randomizer app is divided in three steps – in step one you provide a list of the contestants’ name and email, divided by a comma (each contestant on a separate line). In the second step, you provide a prize name and a number, signifying the number of copies that have been offered. In the last step, you get a randomly selected list of contestants and their prizes.

    Read More Demo

    Parallax Content Slider with CSS3 and jQuery

    March 16, 2012 | Animation, CSS2 / CSS3.0, Gallery, Slider
    Parallax Content Slider with CSS3 and jQuery with Demo

    Today we want to share a simple jQuery parallax content slider with you. Using CSS animations, we’ll control the animation of each single element in the slider and create a parallax effect by animating the background of the slider itself.

    The idea for this comes from the slider of the Kendo UI homepage, a framework for modern HTML UI. After we got some requests and questions about how to do something like that, we decided to recreate the effect.

    Read More Demo

    Metro JS : jQuery Metro interfaces on the web

    March 13, 2012 | Plugins, Slider, Web
    Metro JS : jQuery Metro interfaces on the web

    Metro JS is a JavaScript plugin for jQuery developed to easily enable Metro interfaces on the web . This release focuses on Live Tiles, the Application Bar and Theming. It’s early in the development phase, but all features should work on at least IE7+(Win/WinPhone), Firefox, Chrome, Android, Opera, and Safari(OSX/iOS).

    Features

    • Full “future proof” hardware acceleration for browsers that support it now and those that will in the future
    • Uses Modenizr if already available or built in capability checking via the same methods if not
    • Slide tiles that stop at an arbitrary number of points to reveal the tile behind it (e.g. Me tile, or the animated clouds on the projects page)
    • Flip tiles that flip between two static containers
    • Flip tiles that assign new images at random or sequentially from an array of images
    • Lists of tiles that can flip between static containers
    • Lists of tiles that assign images with adjustable levels of randomness for mosaics and other unique content presentations
    Read More Demo