CSS horizontal scrolling overflow with jQuery slider
Posted
by Jeffrey
on Stack Overflow
See other posts from Stack Overflow
or by Jeffrey
Published on 2010-05-17T17:07:48Z
Indexed on
2010/05/17
17:10 UTC
Read the original article
Hit count: 209
I'm trying to setup a full screen jquery slider. I've broken the project into two steps 1) css and 2) js.
1) CSS, below is a picture of what I'm shooting for (no fixed height) and below that is the code I have so far that doesn't work.
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<style type="text/css">
/* Positioning */
#container { width: 2500px; }
.block { display: inline; }
/* Styling */
.block img { padding: 5px; }
</style>
</head>
<body>
<div id="container">
<div class="block"><img src="http://i42.tinypic.com/1zp2poz.gif"></div>
<div class="block"><img src="http://i42.tinypic.com/1zp2poz.gif"></div>
<div class="block"><img src="http://i42.tinypic.com/1zp2poz.gif"></div>
</div>
</body>
</html>
2) Javascript, using jquery I'd like the divs to slide left when clicked on them... like the jQuery Coda Slider if possible.
Thanks, any help is appreciated.
© Stack Overflow or respective owner
