jquery图像滑块自动播放并单击

时间:2013-03-28 06:31:06

标签: jquery jquery-ui

请在此代码中建议我需要做出的任何更改,以便在4000毫秒之后使此滑块自动播放。直接在click.i上工作正常。在做了一些建议之后做了一些改动但是它没有工作

<script type="text/javascript"> 
$(function() {    
var Page = (function() {    
var $navArrows = $( '#nav-arrows' ),
$nav = $( '#nav-dots > span' ),
slitslider = $( '#slider' ).slitslider( {
onBeforeChange : function( slide, pos ) {

$nav.removeClass( 'nav-dot-current' );
$nav.eq( pos ).addClass( 'nav-dot-current' );    
}
} ),    
init = function() {    
initEvents();    
},
initEvents = function() {    
// add navigation events
$navArrows.children( ':last' ).on( 'click', function() {    
slitslider.next();
return false;    
} );    
$navArrows.children( ':first' ).on( 'click', function() {    
slitslider.previous();
return false;    
} );
$nav.each( function( i ) {    
$( this ).on( 'click', function( event ) {    
    var $dot = $( this );    
    if( !slitslider.isActive() ) {    
            $nav.removeClass( 'nav-dot-current' );
            $dot.addClass( 'nav-dot-current' );    
    }    
    slitslider.jump( i + 1 );
    return false;    
} );    
} );    
};    
return { init : init };    
})();    
Page.init();    
});
</script>

1 个答案:

答案 0 :(得分:0)

只看slitslider docs我认为您需要将这两行添加到以下代码摘录中:

.slitslider({

    // slideshow on / off
    autoplay : true,
    // time between transitions
    interval : 4000,

    onBeforeChange : function(slide, pos) {
    $nav.removeClass('nav-dot-current');
    $nav.eq(pos).addClass('nav-dot-current');
    }