0

我是网络开发领域的新手。

我正在创建一个网页。在主页上有一个 javascript 图片幻灯片请在此处查看：http: //bluearrowsystems.com/index.php。现在滑块图像会自动移动。但是，当我将鼠标放在意味着鼠标悬停的图像上时，有什么方法可以移动图像吗？

以下是我的 html 头部分 javascript 代码，我认为但不确定，在此部分中需要添加 javascript 代码。

<link rel="stylesheet" href="res/responsiveslides.css">
<link rel="stylesheet" href="res/example.css">
<script src="res/ga.js"></script>
<script src="res/jquery.js"></script>
<script>window.jQuery || document.write('<script src="http://viljamis.com/js/libs/jquery-
1.8.2.min.js"><\/script>')</script>
<script src="res/responsiveslides.js"></script>
<script>
$(function () {

  // Slideshow 1
  $(".rslides1").responsiveSlides({
    speed: 1000,
    maxwidth: 1024,                                     
    auto:false,



  });


      // Slideshow 2
  $(".rslides2").responsiveSlides({
    auto: true,
    pager: true,
    speed: 500,
    maxwidth: 540,

  });

});
</script>
4

1 回答 1

0

您使用的插件没有外部触发播放的方法。您可以使用其他插件，例如 flexslider。有了它，您将获得所需的功能，如下所示：

$('.rslides1').flexslider().on('mouseover', function(){
    $(this).data('flexslider').next();
});

编辑：如果要在暂停状态下初始化 flexslider 并在鼠标悬停时开始播放，请使用以下代码：

$('.rslides1').flexslider( {slideshow: false} ).on('mouseover', function(){
    $(this).data('flexslider').play();
});
于 2013-06-29T13:10:09.863 回答