在我的产品网站搜索结果中,当主产品图像悬停或鼠标悬停时,我需要以 1 秒的间隔滚动浏览 4 个产品图像。这需要在鼠标移出时停止并重置为主图像。我的图像从主图像(例如主 111.jpg,次要 112.jpg ......)按顺序命名,数字是我现在拥有的,但基本上不起作用,我真的被卡住了。任何帮助,将不胜感激。
例如类似的功能
// when hovering over a result image, alt images display
$('.pImg1').mouseover(function(){
imgRef1 = $(this).attr('src'); // returns the full file path
imgPath1 = imgRef1.substr(0, 11);// returns the first 11 chars starting at 0 ie. ../img/dev/
imgName1 = imgRef1.substr(11, imgRef1.length-15); // returns the actual file name without the extension
imgExtn1 = imgRef1.substr(imgRef1.length-4); // returns the file extension
originalImgName = parseInt(imgName1); // original image name as Integer
imgName2 = originalImgName;
count7 = 1
setInterval(function(){
if(count7 < 4){
if(count7 > 1){
imgName2 = imgName2 + 1; // increments imgName2
count7 = count7 + 1; // increments count7 by 1
}
fullImgName = imgPath1 + imgName2 + imgExtn1;
$(this).attr('src', fullImgName);
} else{
imgName2 = originalImgName; // resets image name back to original
count7 = 1; // resets counter
fullImgName = imgPath1 + imgName2 + imgExtn1;
$(this).attr('src', fullImgName);
}
}, 1000);// end setInterval
}); // end hover