Question

使用jquery淡入＆amp;在我的页面上显示一系列png图像。它很棒（下面的代码）！但是，我想在同一页面上的新表格单元格内创建第二组完全不同的淡入淡出图像，并且无法同时使两者同时运行。我觉得它很简单，但我是一个新的编码器，并尝试了几个选项无济于事。我对单组淡入淡出图像的成功代码如下...我需要在表格单元格中重新创建类似的内容吗？

$(function(){
    $('.fadein img:gt(0)').hide();
    setInterval(function(){$('.fadein :first-child').fadeOut().next('img').fadeIn().end().appendTo('.fadein');}, 4000);
});

.fadein { position:absolute; left:5; top:0; }
.fadein img { position:absolute; left:0; top:0; }
    
.fadelinks, .faderandom { position:absolute; }
.fadelinks > *, .faderandom > * { position:absolute; }
    
.multipleslides { position:relative; height:563px; width:550px; float:left; }
.multipleslides > * { position:absolute; left:0; top:0; display:block; }

<head>
    <img src="map.png" width="1334" height="786" border="0" usemap="#Map" />
    <map name="Map" id="Map">
      <area shape="poly" coords="80,604,94,654,300,599,286,550" href="doit.html" />
      <area shape="poly" coords="60,535,76,590,347,516,335,461" href="http://WhiteboardCreative.net/" />
      <area shape="poly" coords="43,460,57,519,401,429,384,368" href="whoweart.html" />
    </map>
    
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
</head>
<body>
    <h1>
    
    <div class="fadein"; align="left">
      <img src="notes active/notes1.png" />
      <img src="notes active/notes4.png" />
      <img src="notes active/notes3.png" />
      <img src="notes active/notes2.png" />
      <img src="notes active/notes5.png" />
      <img src="notes active/notes7.png" />
      <img src="notes active/notes8.png" />
      <img src="notes active/notes9.png" />
      <img src="notes active/notes10.png" /></div>
    </div>
    <h2>
</body>

Answer 1

只需定位您的包装.each()父母的.fadein套：

$(".fadein").each(function(){
    // Now use `$(this)` to reference to the .fadein
    $(this).find('img:gt(0)').hide();
    setInterval(function(){
        $(this).find('img:first-child').fadeOut().next('img').fadeIn().end().appendTo( this );
    }, 4000);
});

多个Jquery在同一个XHTML页面上淡化图像

1 个答案: