Question

我搜索了我的问题并没有找到它。

我有这个鳕鱼用于幻灯片放映，需要添加暂停鼠标悬停图像。我试着做了几个小时但是不能。这是代码：

    $().ready(function() {  
 $('#ctgslider').ctgslider({
    'timelength':1000, 
    'showbuttons': 'Y',
    'minibuttons':'Y', 
    'minibuttonopacity': .45, 
    'centerbuttons': 'Y', 
    'alignrightnextbutton' : 'Y',
    'btnoffset':5 ,
    'effects':'fade',
    'captioneffects':'explode',
    'captionclass':'.Caption', 
    'usenumbers':'Y',
    'minibtnimagesrc':'slider/images/circle.png',
    'usecaptions':'Y'


    }); 

});


$(document).ready(function(){
  $('#ctgslider').mouseenter(function(){
    $('#ctgslider').ctgslider({'timelength':'900000'});
  });
  $('#ctgslider').mouseleave(function(){
    $('#ctgslider').ctgslider({'timelength':'1000'});
  });
});

想要玩这部分代码：

 $(document).ready(function(){
  $('#ctgslider').mouseenter(function(){
    $('#ctgslider').ctgslider({'timelength':'900000'});
  });
  $('#ctgslider').mouseleave(function(){
    $('#ctgslider').ctgslider({'timelength':'1000'});
  });

任何人都可以帮我改进代码，让鼠标停留在div“ctgslider”上吗？

谢谢

Answer 1

The slider似乎没有暴露任何可以吸引的事件，这会让生活变得有点困难。

快速解决方法是将此代码添加到HTML文件的底部：

sliderPaused = false;
$("#ctgslider").hover(function(){
  sliderPaused = true;
}, function(){
  sliderPaused = false;
});

然后确保您使用的是非缩小版本的脚本并更改NextPicture函数，如下所示：

function NextPicture(e){
  if(sliderPaused && !e) return;

将函数传递给事件对象，这意味着您可以区分悬停在滑块上并单击下一个幻灯片按钮。

这里是demo

如何暂停鼠标悬停在此代码上的幻灯片图像？

1 个答案: