jquery在鼠标悬停的交换图像库

在我的演示中，您可以看到当您用鼠标悬停在缩略图图像上时，更大的图片正在改变。我想要什么？我想在几秒钟后自动更改图像。

我需要为它做些什么？任何人都可以帮助我？

$(document).ready(function() { 

    $("#magazin_sldwr li img").hover(function(){ 
     $('#mainm-img').attr('src',$(this).attr('src').replace('thumb/', '')); 
    }); 
    var imgSwap = []; 
    $("#magazin_sldwr li img").each(function(){ 
     imgUrl = this.src.replace('thumb/', ''); 
     imgSwap.push(imgUrl); 
    }); 
    $(imgSwap).preload(); 
}); 
$.fn.preload = function() { 
    this.each(function(){ 
     $('<img/>')[0].src = this; 
    }); 
}

来源

2014-10-16 innovation

这是一个开始：demo

的想法是对当前图像的父li使用.active类，然后引发mouseenter事件每隔2秒：

function autoChangeImage() { 
    setTimeout(function(){ 
     $("#magazin_sldwr li.active") 
      .removeClass('active') 
      .next('li') 
      .addClass('active') 
      .children('img') 
      .trigger('mouseenter'); 
     autoChangeImage(); 
    }, 2000); 
}

当然，你可能会想已到达最后一后回到第一拇指和clearTimeout“手动”徘徊拇指时：demo

来源

2014-10-16 13:58:10 Brewal

使用setInterval()

setInterval(function() { 
    //change image 
}, 2000);

其中2000是毫秒数。邻LY一个变化，你可以使用setTimeout()

来源

2014-10-16 13:52:58 Barry127

jquery在鼠标悬停的交换图像库

回答

相关问题