javascript - 如何在jquery对 Angular 图像 slider 中添加事件类

Question

Diagonal-Slider

我已经开发了这个插件，但问题是当我加载焦点时图像处于正常状态。我的问题是如何在加载和悬停时默认放置事件图像。

Answer 1

您只需以编程方式触发鼠标悬停事件即可在页面加载时选择事件图像。我使用第 n 个子选择器在 2 张幻灯片上触发事件，您可以使用 1,3 或您想要的任何内容

$(document).ready(function(){
    $('.gallery_content').createDiagonalSlider();


   setTimeout(function(){
   $('.gallery_content .gallery_item:nth-child(2)').mouseover();
   },10);

   });

这是工作 fiddle http://jsfiddle.net/1tu061u9/

对于您想要的功能

make image active until next image is not hovered

您需要替换 DiagonalSlider.js 中第 45 行的代码。

slider.find('.gallery_item').hover(function(){
        var item = $(this);

            if (timeout){
                clearTimeout(timeout);    
            }

            timeout = setTimeout(function(){
                zoomIn(item, function(){ }); 
            }, 10);

    }, function(){

    });

这是新的工作 fiddle 。 http://jsfiddle.net/ytzg32w6/2/