jQuery is a cross-browser JavaScript library that was designed in order to simplify the client-side scripting of HTML. jQuery is a high-speed and succinct JavaScript Library that makes HTML document navigating, event management, animating, and Ajax connections easier for quick web development. With its amazing features and ease of use, jQuery has changed the way you write JavaScript.
Today we bring a recently released fresh collection of beautiful jQuery image sliders and galleries, tutorials & Plugins.
GalleryView
Demo Link
GalleryView is a content-gallery plugin which can display any HTML content in an animated gallery view. It requires jQuery Timers plugin to facilitate timing of animation events. You can add title, caption and description if you want to explain what the image is all about.
Thumbnails Navigation Gallery
Demo Link
This tutorial will demonstrate how to create an elegant gallery with scrollable thumbnails that slide out from a navigation. jQuery and CSS3 will be used to create a menu of albums where each item will reveal a horizontal bar with thumbnails when clicked, the thumbnail container will scroll automatically on mouse hover.
Hover Slide Effect with jQuery
Demo Link
In this tutorial you will create an image area with several images that slide out when you hover over them, revealing other images on random basis.
Supersized
Supersized is a Full Screen Background/Slideshow jQuery plugin which resizes images to fill browser while maintaining image dimension ratio. It also cycles images via slideshow with transitions and preloading. Navigation controls enables you to pause/play and forward/back.
SIDEWAYS
Demo Link
Sideways is an excellent full screen image galley created using jQuery framework and simple CSS which supports looping and loading new image with different dimensions updates. The script utilizes native browser scrollbars and click to open panel mode, extremely suitable for touch devices.
Galleriffic
Demo Link
Galleriffic is a jQuery plugin that handled high volumes of photos while economizing bandwidth and provide flawless gallery browsing experience. It supports keyboard navigation and image captions. Multiple galleries can be created per page with very easy configuration.
Full Page Image Gallery with jQuery
Demo Link
In this tutorial you will learn to create a full-page gallery with scrollable thumbnails and a scrollable full screen preview. The thumbnail bar at the bottom of the page will scroll automatically when user moves the mouse.
Galleria
Demo Link
The process of creating visually appealing image galleries for the web and mobile devices made easy with this image gallery framework, which is written in JS.
Parallax Slider with jQuery
Demo Link
In this tutorial you will create a vibrant image slider using parallax principle to move different backgrounds when you slide to an image in order to create some nice perspective.
Slider Gallery with jQuery
Demo Link
This tutorial will demonstrate how to create an expanding thumbnails area which opens once an album is chosen. The thumbnails will scroll to the end and move back to the first image. The user can scroll through the thumbnails by using the slider controls.
AD Gallery
Demo Link
Ad Gallery is another jQuery gallery plugin having many diverse features. You can customize whether you want image to slide in or fade in, use keyboard arrows to move back and forth, click on the edge of the big image to go to the next one and many more. It is compatible with all major browsers.
PikaChoose
Demo Link
Pikachoose is an easy to use and lightweight jQuery plugin that make presentation of photos very comfy. Photos can be demonstrated as slideshows, navigation buttons and auto play. It can be installed and customize with ease, also, it comes with very advance features that come up with other complex gallery plugins.
Fresh Sliding Thumbnails Gallery with jQuery and PHP
Demo Link
This is another tutorial showing how to create a full image gallery with nice thumbnail area that scrolls automatically on mouse hover, but it will allow the user to slightly zoom into picture by clicking on it. The thumbnails bar will slide down and the image will get resize according to the screen size.
prettyPhoto
Demo Link
prettyPhoto is a jQuery lightbox clone supporting almost every kind of media including flash, iframes and videos. It is very easy and flexible to setup and customize providing support for all major web browsers even IE6. Useful APIs enables it to be launched from nearly anywhere including Flash.
Beautiful Photo Stack Gallery with jQuery and CSS3
Demo Link
In this tutorial you will create an album as a slider and when an album is chosen, the images of the album will be shown as beautiful photo stack. Using photo stack view, you can browse through the images by putting the top most images behind the entire stack with a slick animation.
Multimedia Gallery for Images, Video and Audio
Demo Link
Using this gallery tutorial you can integrate video and audio as exhibit pieces along images. An XML file for defining the items in the gallery will be used along with a PHP class with an XSL Style sheet to transform the data. For video files you can define a link to a YouTube video.
YoxView
Demo Link
YoxView is a free and open source media and image viewer jQuery plugin which work just like a Lightbox. It is extremely easy to integrate, supports images, inline content, iframes, flash and online video playing via YouTube and Vimeo. Different skins are available to customize according to the viewer’s mood. It is search engine friendly and compatible with every major browser.
Minimalistic Slideshow Gallery with jQuery
Demo Link
In this tutorial you will learn to create a simple and minimalistic slideshow gallery, which will have a container with slideshow and the options to view a grid of thumbnails, pause the slideshow and navigate through the pictures. The thumbnail grid will slide out from the top and enable user to navigate through all the thumbnails.
Slidesjs
Demo Link
Slidesjs is a crazy simple slideshow plugin for jQuery. It’s easy to implement, customize and style. What could be better? With features like looping, auto play, fade or slide transition effects, crossfading, image preloading, auto generated pagination, and the list goes on:
Nivo Slider
Demo Link
A simple jQuery slider with lots of transition effects and also easy to use and implement. One of the best jQuery image sliders out there:
Coin Slider
Demo Link
Another jQuery image slider with unique transition effects and easy to use and implement and also compatible with most web browsers:
slideViewer
Demo Link
slideViewer is a lightweight (3.5Kb) jQuery plugin which allows you to instantly create an image gallery by writing just few lines of HTML such as an unordered list of images:
Moving Boxes
Demo Link
Moving Boxes has been developed by CSS-Tricks — a unique kind of content slider you surely want to check. Why not give it a try now:
Smooth Div Scroll
Demo Link
Smooth Div Scroll is a jQuery plugin that scrolls content horizontally left or right. Apart from many of the other scrolling plugins that have been written for jQuery.
Slideshow 2!
Demo Link
Slideshow 2! is a javascript class for Mootools 1.2 to stream and animate the presentation of images on your website. Try it out:
Using the Wonderful jFlow Plugin
Demo Link
A beautiful use of jFlow Plugin has been shown on Nettuts+ network. Check out this tutorial:
Advanced jQuery background image slideshow
Demo Link
A very well explained tutorial on how to create a background image slideshow:
Simple JQuery Image Slide Show with Semi-Transparent Caption
Demo Link
Here you can learn how to create a simple image slide show with a semi-transparent caption with jQuery:
How to Create a Simple iTunes-like Slider
Demo Link
Take a look at how to create a slider similar to the one used in the iTunes store:
AnythingSlider jQuery Plugin
Demo Link
As the name already says, you can slide basically anything (images or content, or both) using this jQuery slider plugin:
Creating a Slick Auto-Playing Featured Content Slider
Demo Link
A nice tutorial on how to create a slick auto-playing featured content slider:
Shadowbox
Demo Link
Shadowbox is an online media viewer application that supports all of the web’s most popular media publishing formats. Shadowbox is written entirely in JavaScript and CSS and is highly customizable.
Colorbox
Demo Link
A light-weight, customizable lightbox plugin for jQuery 1.3.
s3Slider jQuery plugin
Demo Link
s3Slider is a free plugin built in jQuery for cross-fading slideshow.
jQuery Image Overlay Plugin
Demo Link
The image overlay plugin is a simple jQuery plugin that attempts to present an image with an overlaid title/caption. The overlay drops in on hover, as you can see above.
The jQuery Cycle Plugin
Demo Link
The jQuery Cycle Plugin is a lightweight slideshow plugin. It supports pause-on-hover, auto-stop, auto-fit, before/after callbacks, click triggers and many transition effects. It also supports, but does not require, the Metadata Plugin and the Easing Plugin.
Create Beautiful jQuery slider tutorial
Demo Link
As a jQuery tutorial, this item would be really helpful when you need to create a beautiful jQuery sliders with image description and names.
Making a Slideshow with jQuery
Demo Link
This would be another jQuery tutorial to create a slideshow. The preview above says all about itself.
jQuery – Creating a Slideshow
Demo Link
Learning this jQuery tutorial helps you to create a slideshow. Also you would be able to use the slideshow to display everything you like putting in HTML.
How to add Slideshow to jQuery lightbox plugin
Demo Link
In this jQuery tutorial you will learn how to extend a jQuery lightbox plugin to have a slideshow.
Image Flow
Demo Link
In fact Image Flow is inspired by Apple’s cover flow. The javascript renders the cover flow effect without any noticeable flaw. Keyboard navigation (arrow keys), mouse scroll and dragging is supported. Very cool script to use.
EOGallery
Demo Link
EOGallery is a web animated slideshow gallery made with jQuery. It only uses basic jQuery functions.
Ultimate Fade-in slideshow
Demo Link
This is a robust, cross browser fade in slideshow script that incorporates some of your most requested features all rolled into one. Each instance of a fade in slideshow on the page is completely independent of the other, with support for different features selectively enabled for each slideshow.
Awesome jQuery Image Gallery Plugin(Thumbox)
Demo Link
Browse the images via mini-gallery. Display images description.Effects for input and output images. Keyboard navigation.Navigation with the mouse wheel.
jbgallery 3.0(Big Multiple Images Slideshow With JQuery)
Demo Link
jbgallery is a UI widget webpage written in javascript on top of the jQuery library. Its function is to show a single big image, multiple images, multiple galleries, slideshows, as a site’s background, in a “dialog” mode or as a common pop-up.
Related posts:
- 14 Fresh jQuery Plugins Focusing On Image Gallery And Slideshows
- All About jQuery:40 Fresh and Useful Tutorials and Plugins
- The 10 most efficient jQuery galleries around the web
0 件のコメント:
コメントを投稿