Slides, A Slideshow Plugin for jQuery
Basic HTML Structure
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
<div id="slides"> <div> <div> <h1>Slide 1</h1> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> </div> <div> <h1>Slide 2</h1> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> </div> <div> <h1>Slide 3</h1> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> </div> <div> <h1>Slide 4</h1> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> </div> </div> </div> |
Basic CSS
1 2 3 4 5 6 7 8 9 10 11 |
<style type="text/css" media="screen"> .slides_container { width:470px; height:170px; } .slides_container div { width:470px; height:170px; display:block; } </style> |
Basic Initialization
1 2 3 4 5 |
<script> $(function(){ $("#slides").slides(); }); </script> |
