在[关闭]上交换多个鼠标图像答案

【问题标题】：swaping multiple images of mouse over [closed]在[关闭]上交换多个鼠标图像
【发布时间】：2014-02-25 07:13:54
【问题描述】：

当我悬停图像连续更改三个不同的图像。但问题是：它只显示两个图像。第三张图片丢失。我该如何解决这个问题？

function changeimage(img_id)
{
    var prefix = "http://247nywebdesign.com/";
    prefix += "Testing/nurses-jewel/php/pdt_images/prdt_";
    $("#" + img_id).fadeOut(1500);
    $("#" + img_id).attr("src", prefix + "03.jpg").fadeIn(500);
    $("#" + img_id).attr("src", prefix + "03.jpg").show(4000);
    $("#" + img_id).attr("src", prefix + "05.jpg").fadeIn(500);
    $("#" + img_id).attr("src", prefix + "05.jpg").fadeIn(2000);
    $("#" + img_id).attr("src", prefix + "05.jpg").show(4000);
    $("#" + img_id).attr("src", prefix + "05.jpg").fadeOut(1500);
    $("#" + img_id).attr("src", prefix + "03.jpg").fadeIn(1000);
}

http://jsfiddle.net/L7Pcx/4/

【问题讨论】：

"fade in" + "show" number 3, "fade in" + "fade in" + "show" + "fade out" number 5, "fade in" number 3... 说真的，你想达到什么目的？？以混乱的方式闪烁图像？

标签： javascript jquery html mouseover

【解决方案1】：

如果您认为这与预期相同，请选中并标记。

以上图片仅供参考。使用最后一张图片进行悬停测试。

http://jsbin.com/towib/

【讨论】：

【解决方案2】：

您需要将所有操作排队

$("#"+img_id)
  .fadeOut(1500)
  .queue(function(next) { $(this).attr("src","http://247nywebdesign.com/Testing/nurses-jewel/php/pdt_images/prdt_03.jpg"); next(); })   
  .fadeIn(500)
  // ...

【讨论】：

你能在js fiddle中显示吗

【解决方案3】：

在第一个淡入淡出效果结束时传递它;

    $("#"+img_id).attr("src","http://247nywebdesign.com/Testing/nurses-jewel/php/pdt_images/prdt_03.jpg").fadeIn(500, 
    function () {
          $("#"+img_id).attr("src","http://247nywebdesign.com/Testing/nurses-jewel/php/pdt_images/prdt_03.jpg").show(4000);
    }
});

问候

【讨论】：

你能在js fiddle中显示吗