Stop on mouse over on a simple jquery slider -


i have real simple jquery slider, fits use. linked images, no controls, thumbs, nothing, simple!

i'm trying make stoo while mouse cursor on it, wasn't able to. can me here?

slider.js

function slideswitch()     {         var $active = $('#slideshow a.active');         if ( $active.length == 0 ) $active = $('#slideshow a:last');         var $next =  $active.next().length ? $active.next()         : $('#slideshow a:first');          $active.addclass('last-active');          $next.css({opacity: 0.0})         .addclass('active')         .animate({opacity: 1.0}, 1000, function()         {             $active.removeclass('active last-active');         }); } $(function() {     setinterval( "slideswitch()", 10000 ); }); 

slider.css

#slideshow { height: 300px; position: relative; width: 960px; } #slideshow { left: 0; opacity: 0.0; position: absolute; top: 0; z-index: 8; } #slideshow a.active { opacity: 1.0; z-index:10; } #slideshow a.last-active { z-index: 9; } 

html

    <div id="slideshow">         <a href="#" class="active"><img src="img/slideshow/slide1.png" alt="engine - development solutions" /></a>         <a href="#"><img src="img/slideshow/slide2.png" alt="engine - development solutions" /></a>         <a href="#"><img src="img/slideshow/slide3.png" alt="engine - development solutions" /></a>     </div> 

thanks!

you'll want clear interval on mouseenter, start slider again on mouseleave. can use jquery's hover() function shortcut:

working demo

$(function() {     var interval = setinterval( slideswitch, 10000 );      $('#slideshow').hover(function() {         clearinterval(interval);     }, function() {         interval = setinterval( slideswitch, 10000 );     }); }); 

Comments

Popular posts from this blog

java - How to Configure JAXRS and Spring With Annotations -

visual studio - TFS will not accept changes I've made to a Java project -

php - Create image in codeigniter on the fly -