John and Tina's Gower run/title> <script type="text/javascript" src="js/jquery-1.5.2.min.js"></script> <script type="text/javascript" src="js/jquery.gallerax-0.2.js"></script> <script type="text/javascript" src="js/jquery.slidertron-0.1.js"></script> <script type="text/javascript" src="js/filter.js"></script> <link rel="stylesheet" type="text/css" href="css/style.css" />     </head> <body> <div id="wrapper"> <div id="logo"> <h1>John and Tina's Gower run<span> September 25th 2011</span></h1> </div> <div id="categories"> <ul> <li><a href="report.html"target="_blank" id="category1" class="current">report soon</a></li> <li><a href="#" id="category2" class="filter"></a></li> <li><a href="#" id="category3" class="filter"></a></li> <li><a href="#" id="category4" class="filter"></a></li> <li><a href="#" id="category5" class="filter"></a></li> <li><a href="#" id="category6" class="filter"></a></li> </ul> </div> <div id="gallery">   <div id="output"> <img src="images/1.jpg" alt="" /> </div> <div id="slider"> <a href="#" class="previous"><img src="images/up.png" alt="up" width="38" height="21" /></a> <div class="viewer"> <div class="reel">   <div class="slide"> <ul class="thumbnails"> <li><img src="images/JVF1.jpg" title="Dave's gallery ; A backdrop befitting our 5's" alt="" width="100" height="75" /></li> <li><img src="images/JVF2.jpg" title="Dave's gallery ; Well tended 5's meet well tended shrubbery" alt="" width="100" height="75" /></li> <li><img src="images/JVF3.jpg" title="Dave's gallery; Very much a 'hoods up' day " alt="" width="100" height="75" /></li> <li><img src="images/JVF4.jpg" title="Dave's gallery; A girl can't keep too well insulated, y'know?." alt="" width="100" height="75" /></li> </ul> </div>    <div class="slide"> <ul class="thumbnails"> <li><img src="images/JVF5.jpg" title="Dave's gallery ; The Genes Kelly." alt="" width="100" height="75" /></li> <li><img src="images/JVF6.jpg" title="Dave's gallery ; Always a delight to catch up with friends." alt="" width="100" height="75" /></li> </ul> </div>          <div class="slide"> <ul class="thumbnails"> <li><img src="images/JVF1.jpg" title="JVF's gallery ; Arriving at Port Einon" alt="" width="100" height="75" /></li> <li><img src="images/JVF2.jpg" title="JVF's gallery ; The troops are gathering" alt="" width="100" height="75" /></li> <li><img src="images/JVF3.jpg" title="JVF's gallery; moving on towards Kidwelly " alt="" width="100" height="75" /></li> <li><img src="images/JVF4.jpg" title="JVF's gallery; Happy snapper on the balcony" alt="" width="100" height="75" /></li> </ul> </div>    <div class="slide"> <ul class="thumbnails"> <li><img src="images/JVF5.jpg" title="JVF's gallery ; time for a chinwag" alt="" width="100" height="75" /></li> <li><img src="images/JVF6.jpg" title="JVF's gallery ; let's go and have lunch" alt="" width="100" height="75" /></li> </ul> </div>  </div> </div> <a href="#" class="next"><img src="images/down.png" alt="down" width="38" height="21" /></a> </div> <div id="captions"> <div id="nav"> <ul> <li><a href="#" class="navFirst">[ << ]</a></li> <li><a href="#" class="navPrevious">[ < ]</a></li> <li><a href="#" class="navNext">[ > ]</a></li> <li><a href="#" class="navLast">[ >> ]</a></li> <li><a href="#" class="navStopAdvance">[ Stop ]</a></li> <li><a href="#" class="navPlayAdvance active">[ Play ]</a></li> </ul> </div> <span class="line">Gower and onwards.</span> <br class="clear" /> <span class="line2">Some cracking roads in the Gower.</span> </div> <br class="clear" /> <script type="text/javascript"> $('#slider').slidertron({ viewerSelector: '.viewer', reelSelector: '.viewer .reel', slidesSelector: '.viewer .reel .slide', slidernavPreviousSelector: '.previous', slidernavNextSelector: '.next', slidernavFirstSelector: '.first', slidernavLastSelector: 'last', slideradvanceDelay: '16000', slideradvanceResume: '16000' }); </script> <script type="text/javascript"> $.gallerax({ outputSelector: '#output img', // Output selector thumbnailsSelector: '.thumbnails li img', // Thumbnails selector captionSelector: '#captions .line', // Caption selector captionLines: 2, // Caption lines (3 lines) fade: 'medium', // Transition speed (medium) navNextSelector: '#nav a.navNext', // 'Next' selector navPreviousSelector: '#nav a.navPrevious', // 'Previous' selector navFirstSelector: '#nav a.navFirst', // 'First' selector navLastSelector: '#nav a.navLast', // 'Last' selector navStopAdvanceSelector: '#nav a.navStopAdvance', // 'Stop Advance' selector navPlayAdvanceSelector: '#nav a.navPlayAdvance', // 'Play Advance' selector advanceFade: 'slow', // Advance transition speed (slow) advanceDelay: 6000, // Advance delay (6 seconds) advanceResume: 12000, // Advance resume (12 seconds) thumbnailsFunction: function(s) { // Thumbnails function return s.replace(/_thumb\.jpg$/, '.jpg'); } }); </script>  </div> <div id="footer"> <p>  </p> </div> </div>  <div style="text-align: center; font-size: 0.75em;">Design downloaded from <a href="http://www.freewebtemplates.com/">free website templates</a>.</div></body> </html>