Jquery 在容器元素的鼠标上方切换图像

在我的产品网站搜索结果中，当主产品图像悬停或鼠标悬停时，我需要每隔1秒滚动4个产品图像。这需要停止并重置为鼠标输出上的主图像。 我的图像是从主图像（如primary 111.jpg，secondary 112.jpg…）按顺序命名的，数字。下面的代码是我现在拥有的，但基本上不起作用，我真的被卡住了。任何帮助都将不胜感激

e、 g

//将鼠标悬停在结果图像上时，会显示alt图像
$（'.pImg1'）.mouseover（函数（）{
imgRef1=$（this.attr（'src'）；//返回完整的文件路径
imgPath1=imgRef1.substr（0，11）；//返回从0开始的前11个字符，即../img/dev/
imgName1=imgRef1.substr（11，imgRef1.length-15）；//返回不带扩展名的实际文件名
imgExtn1=imgRef1.substr（imgRef1.length-4）；//返回文件扩展名
originaligname=parseInt（imgName1）；//原始图像名称为整数
imgName2=原始名称；
count7=1
setInterval（函数（）{
如果（计数7<4）{
如果（计数7>1）{
imgName2=imgName2+1；//递增imgName2
count7=count7+1；//将count7增加1
}
fullImgName=imgPath1+imgName2+imgExtn1；
$（this.attr（'src'，fullImgName）；
}否则{
imgName2=originaligname；//将图像名称重置回原始名称
count7=1；//重置计数器
fullImgName=imgPath1+imgName2+imgExtn1；
$（this.attr（'src'，fullImgName）；
}
}，1000）；//结束设置间隔
}); // 结束悬停

试试这个。假设您提供了使用图像名称的正确方法，它应该可以工作

$(function() {
    var interval, originalName,
        startAnimation = function() {
           var  img = $(this), path = img.attr('src'),
                preffix = path.substr(0, 11), 
                name = parseInt(path.substr(11, path.length - 15), 10),
                ext = path.substr(path.length - 4),
                counter = 1;
           originalName = path;

           //stop animation if it is running
           if(interval !== undefined) { interval = clearInterval(interval);}

           interval = setInterval(function(){
               img.attr('src', preffix + (name + (counter++)%4) + ext); 
           }, 1000);


        }, 
        stopAnimation = function() {
            var img = $(this);

            if(interval !== undefined) { interval = clearInterval(interval);}
            img.attr('src', originalName);
        };

    $(".pImg1").hover(startAnimation, stopAnimation);
});

---

非常感谢你，尤里。你已经成功了，这就像一个符咒！

$(function() {
    var interval, originalName,
        startAnimation = function() {
           var  img = $(this), path = img.attr('src'),
                preffix = path.substr(0, 11), 
                name = parseInt(path.substr(11, path.length - 15), 10),
                ext = path.substr(path.length - 4),
                counter = 1;
           originalName = path;

           //stop animation if it is running
           if(interval !== undefined) { interval = clearInterval(interval);}

           interval = setInterval(function(){
               img.attr('src', preffix + (name + (counter++)%4) + ext); 
           }, 1000);


        }, 
        stopAnimation = function() {
            var img = $(this);

            if(interval !== undefined) { interval = clearInterval(interval);}
            img.attr('src', originalName);
        };

    $(".pImg1").hover(startAnimation, stopAnimation);
});