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 