jQuery鼠标悬停和鼠标滑出幻灯片

时间:2012-09-06 11:50:31

标签: jquery mouseover

以下脚本工作正常,但我希望隐藏箭头(#leftControl #rightControl),然后在悬停幻灯片时显示。问题是,如果我们在第一张幻灯片上,只需要出现右箭头而反之,这就是为了避免在没有任何内容可以看到的情况下让幻灯片向左或向右滑动。

 // manageControls: Hides and Shows controls depending on currentPosition
 function manageControls(position){
// Hide left arrow if position is first slide
if(position==0){ $('#leftControl').hide() } else{ $('#leftControl').show() }
// Hide right arrow if position is last slide
if(position==numberOfSlides-1){ $('#rightControl').hide() } else{  $('#rightControl').show() }
} 

full script

1 个答案:

答案 0 :(得分:1)

function manageControls(position){

$('#slide_container').mouseenter(function(){
        // Hide left arrow if position is first slide
        if(position==0){ 
                $('#leftControl').hide(); 
        } else { 
                $('#leftControl').show();
        }
        // Hide right arrow if position is last slide
        if(position==numberOfSlides-1){ 
                $('#rightControl').hide(); 
        } else{  
                $('#rightControl').show();
        }
});

$('#slide_container').mouseleave(function(){
        $('#leftControl').fadeOut();
        $('#rightControl').fadeOut();
});

}