通过淡化来切换两个图像

如何使用jQuery .fadeToggle方法通过淡入.fadeToggle切换两个图像。

Answer 1

你必须使用position:absolute;将你想要的两个元素交叉淡入一个在另一个之上position:absolute; 。 你先隐藏一个。 要进行交叉渐变，您只需在两个元素中的每一个上同时运行fadeToggle() 。

HTML：

 
 
 Click 

CSS：

 #d1, #d2 {position:absolute; top:12px; left:12px; width:120px; height:120px;} span {position:absolute; top:200px; left:12px; cursor:pointer;} 

Javascript：

 $(document).ready(function(){ $("#d1").show(); $("#d2").hide(); $("span").click(function(){ // For demo's sake we attach the crossFade to a click event. $("#d1").fadeToggle(500); $("#d2").fadeToggle(500); }); }); 

Answer 2

这是你想要做的吗？ http://jsfiddle.net/U5GSy/

这是小提琴中的代码

 $(function(){ $("input:button").click(function(){ $(".cat").fadeToggle("fast"); }); });   
  #cat1 { position:absolute; top:0; left:0; } #cat2 { display:none; position:absolute; top:0; left:0; } input { position:absolute; top: 220px; } 

Answer 3

使用fadeToggle两次。 这将在3张图片之间切换。 只需设置imgno即可更改它。 并且还要记住，这应该大于src数组中的源。

   
Hold