Question

在自定义javascript jquery代码中使用图像，该代码将正确显示在页面上

Answer 1

您可以使用其dots属性通过插件执行此操作。我知道它对初始幻灯片不起作用。您必须等待它转到下一张幻灯片才能工作。

$(function() {
    $('.banner').unslider(
    {
      speed: 500,               //  The speed to animate each slide (in milliseconds)
    delay: 5000,

      dots:true,
      complete:function () {
        var index = $('#hp-banner .dot.active').index ();
        $('#hp-banner-right li').removeClass ('active').eq (index).addClass ('active');
      }
    }
    );
});

启用点将为滑块添加点，您可以单击该点以转到特定幻灯片。当前点将具有active类。您可以使用complete回调查找活动点的索引，然后为相应的横幅链接指定相应的类。

我在这个问题上找到了这个方法。 https://github.com/idiot/unslider/issues/168

Answer 2

不幸的是你不能，因为即使插件有一个内置的事件在完成时被触发，这允许你运行一个函数（使用complete对象，checking the source我们可以看到无法在视图中访问滑块图像的当前索引，因此您无法指定要突出显示的链接。

这个问题必须是brought up with the plugin author才能允许索引访问（就像.move()方法一样，令人惊讶地允许索引访问和回调）。

第152和153行：

//  Move Unslider to a slide index    // #152
_.to = function(index, callback) {    // #153

匹配旋转突出显示的箭头div

2 个答案: