jquery slider

In This tutorial we are going to learn how to make a cool looking slide effect using jQuery that will really make our images pop.

The Live Demo

Click HERE to see the full working demo.

October 20th, 2010 in JQuery Tutorials by Lee Grant
jQuery Slide Effect2 Votes, Rating: 5.00 Loading …0diggs
digg4
Share About The Author: Lee GrantLee has a passion for all things design and web related and spends his days working as a full time web developer at Covenant Solutions. He most enjoys working on new web interfaces and working with html & css. When not sat in front of the computer he enjoys jogging and cinema. If you want to follow him on his path then head over to his website at Klever media.

Lee Grant has written 1 posts. In today’s tutorial we are going to learn how to make a cool looking slide effect using jQuery that will really make our images pop.
The Live Demo
Click HERE to see the full working demo.

What makes this effect
html
css
jQuery

Dreamweaver (or your favourite text editor)

Setting up our files
Ok let’s start by opening our text editor and creating a new html document, save this to your desktop as “index.html”. Now create a new css file and save this as “style.css” in a new folder named “css”.

Include our files
Getting back to our index file, we now need to include our newly created css file and the jQuery library into the head of our document.

1 <link href="style.css" rel="stylesheet" type="text/css" />

In this tutorial we are going to link to the google api version of jQuery as the chances are your user has come across this file at some point so it was already be cached on their system. You can alternatively host your own version and link to it which you can download here.

Read More at http://www.hv-designs.co.uk/2010/10/20/jquery-slide-effect/