12 Fresh jQuery Image Plugin Tutorials
1. Fresh JQuery Image Gallery with Captions and Auto Play/Pause Rotation
Tutorials on image galleries and menus are my favorite, because these two things put some attractive look into your webpages.
2. Parallax Slider with jQuery
Happy New Year! We will kick start 2011 with a vibrant image slider tutorial. We will make use of the parallax principle to move different backgrounds when we slide to an image in order to create some nice perspective. This will give a great depth to the whole slider when it’s in motion.
3. Rotating Image Using JQuery
This is my experimental code using JQuery, in this post I want to show you the way how to rotating image using JQuery, so this is what I will create, single image with one button controller that located in the center of the image, and to rotate it user must drag the center button (which mean right click and hold) and the image angle will change based on mouse position.
4. How to Give Your Flickr Images a Zoom Effect with jQuery
Recently a reader asked for more information regarding how I managed to create a zoom effect on my flickr images. The answer? jQuery. Yes I do love the capabilities of PHP, but when it comes to dynamics of a website jQuery is the way to go. With the use of one simple function, and the jQuery library, one can easily create a zoom effect.
5. jTag : A jQuery plugin to tag pictures & more !
A little while ago I published an article on how to create a 非死book like tagging system.
Even thought It worked fine it was a bit messy and kinda hard to impletement.
6. Portfolio Zoom Slider with jQuery
In this tutorial we are going to create some nice effects for a portfolio or similar website with jQuery. We will create a tiny slider and integrate it with the amazing Cloud Zoom plugin and the elegant Fancybox plugin.
7. Bubbleriffic Image Gallery with jQuery
This plugin is a jQuery styling plugin wich allows you to skin form elements.
8. JQuery Based Flipped Image Gallery with Bounce Effects
Image galleries are most important element of any website. Here, I have created a simple jQuery based flipped image gallery. On hover the images will expand. Its simple and stylish gallery. My previous jquery image gallery was appreciated and I thought to give my readers an other one. Hope you will like it. Thanks.
9. jQuery & CSS3 3D Interactive Photo Stack
Hey guys. I’ve been writing a few pieces for .NET magazine on CSS3 and thought I’d whip together something lightweight with jQuery to show you how you can use CSS3 transforms to create 3D interactive photo stacks
10. Hover Slide Effect with jQuery
Today we will create a neat effect with some images using jQuery. The main idea is to have an image area with several images that slide out when we hover over them, revealing other images. The sliding effect will be random, i.e. the images will slide to the top or bottom, left or right, fading out or not. When we click on any area, all areas will slide their images out.
11. How To Create Circular Image Galleries With jQuery
Hey guys. Quite often with image galleries powered by jQuery, we’re presented with a very similar layout – one which contains the images or items presented inside a rectangle. This is great for providing an experience users are used to, but there are a few interesting alternatives that you may like to hear about – how about displaying your images or items around a shape like a circle or an ellipse instead?. In today’s post I’ll be showing you how to do just that with a brand new plugin I’ve written called jQuery Roundrr.
12. Full Page Image Gallery with jQuery
In this tutorial we are going to create a stunning full page gallery with scrollable thumbnails and a scrollable full screen preview. The idea is to have a thumbnails bar at the bottom of the page that scrolls automatically when the user moves the mouse. When a thumbnail is clicked, it moves to the center of the page and the full screen image is loaded in the background. Now the user can move up and down and the image will get scrolled automatically, giving him the opportunity to see all of the image.
ajax 