þÿ<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Slider</title> <link rel="stylesheet" type="text/css" href="style.css" /> <script type="text/javascript" src="js/jquery-1.2.6.min.js"></script> <script type="text/javascript" src="js/jquery-easing-1.3.pack.js"></script> <script type="text/javascript" src="js/jquery-easing-compatibility.1.2.pack.js"></script> <script type="text/javascript" src="js/coda-slider.1.1.1.pack.js"></script> <script type="text/javascript" src="js/Copyright.js"></script> <script type="text/javascript"> var theInt = null; var $crosslink, $navthumb; var curclicked = 0; theInterval = function(cur){ clearInterval(theInt); if( typeof cur != 'undefined' ) curclicked = cur; $crosslink.removeClass("active-thumb"); $navthumb.eq(curclicked).parent().addClass("active-thumb"); $(".stripNav ul li a").eq(curclicked).trigger('click'); theInt = setInterval(function(){ $crosslink.removeClass("active-thumb"); $navthumb.eq(curclicked).parent().addClass("active-thumb"); $(".stripNav ul li a").eq(curclicked).trigger('click'); curclicked++; if( 6 == curclicked ) curclicked = 0; }, 3000); }; $(function(){ $("#main-photo-slider").codaSlider(); $navthumb = $(".nav-thumb"); $crosslink = $(".cross-link"); $navthumb .click(function() { var $this = $(this); theInterval($this.parent().attr('href').slice(1) - 1); return false; }); theInterval(); }); </script> </head> <body> <div id="page-wrap"> <div class="slider-wrap"> <div id="main-photo-slider" class="csw"> <div class="panelContainer"> <div class="panel" title="Panel 1"> <div class="wrapper"> <img src="images/1.jpg" alt="temp" /> <div class="photo-meta-data"> &e Venez decouvrir une nouvelle collection Chic Trendy <a href="http://www.lamyfashion.com/category.php?id_category=6">ici</a><br /> <span></span> </div> </div> </div> <div class="panel" title="Panel 2"> <div class="wrapper"> <img src="images/2.jpg" alt="temp" /> <div class="photo-meta-data"> &e Toutes les marques Hot du moment ici !<br /> <span></span> </div> </div> </div> <div class="panel" title="Panel 3"> <div class="wrapper"> <img src="images/3.jpg" alt="scotch egg" class="floatLeft"/> <h1>EDITION LIMITEE !</h1> <ul> <li>TOUTES TAILLES : TAILLE XS à 4XL. </li> </ul> </div> </div> <div class="panel" title="Panel 4"> <div class="wrapper"> <img src="images/4.jpg" alt="temp" /> <div class="photo-meta-data"> &e Nouveau decouvrez notre rubrique beaute !<br /> <span></span> </div> </div> </div> <div class="panel" title="Panel 5"> <div class="wrapper"> <img src="images/5.jpg" alt="temp" /> <div class="photo-meta-data"> &e Indian Mode Luxury<br /> <span></span> </div> </div> </div> <div class="panel" title="Panel 6"> <div class="wrapper"> <img src="images/6.jpg" alt="temp" /> </div> </div> </div> </div> <a href="#1" class="cross-link active-thumb"><img src="images/1thumb.jpg" class="nav-thumb" alt="temp-thumb" /></a> <div id="movers-row"> <div><a href="#2" class="cross-link"><img src="images/2thumb.jpg" class="nav-thumb" alt="temp-thumb" /></a></div> <div><a href="#3" class="cross-link"><img src="images/3thumb.jpg" class="nav-thumb" alt="temp-thumb" /></a></div> <div><a href="#4" class="cross-link"><img src="images/4thumb.jpg" class="nav-thumb" alt="temp-thumb" /></a></div> <div><a href="#5" class="cross-link"><img src="images/5thumb.jpg" class="nav-thumb" alt="temp-thumb" /></a></div> <div><a href="#6" class="cross-link"><img src="images/6thumb.jpg" class="nav-thumb" alt="temp-thumb" /></a></div> </div> </div> </div> </body> </html>