jQuery show（）動畫或效果？

我有一些JavaScript的隱藏和顯示每2秒例如在我的表中的某些行。但我想在jquery中爲show（）添加一些效果或動畫。我試過slideDown（'slow'），但它不動畫，不知道爲什麼？ fadeIn（'慢'）雖然工作正常，但不能幻燈片？jQuery show（）動畫或效果？

我的JavaScript

<script type="text/javascript"> 
var max = 0; 
var index = 0; 

$(function() { 

    max = $("tbody tr.hidden").length; 
    ticker(); 
}); 

function ticker() { 
    $("tbody tr.hidden:visible").hide(); 

    var a = index; 
    var b = index + 1; 
    var c = index + 2; 
    $("tbody tr.hidden:hidden").filter(":eq(" + a + "), :eq(" + b + "), :eq(" + c + ")").show(1000); /* WANT TO ANIMATE THIS */ 

    index += 3; 
    if (index>= max) index = 0;  

    setTimeout("ticker()", 2000); 
    $('tbody tr:visible:even').css('background-color', '#114c00'); 
} 

</script>

我的HTML

<table id="gradient-style" summary="Currency"> 
    <thead> 
     <tr> 
      <th scope="col" class="flag"></th> 
      <th scope="col" class="currency"></th> 
      <th scope="col" class="title"></th> 
      <th scope="col" class="buy">We Buy</th> 
      <th scope="col" class="sell">We Sell</th> 
     </tr> 
    </thead> 
    <tfoot> 
     <tr> 
      <td colspan="5">Logo Goes here?</td> 
     </tr> 
    </tfoot> 
    <tbody> 
     <tr id="fixed"> 
      <td class="flags"><img src="flags/USD.png" /></td> 
      <td >USD</td> 
      <td>US DOLLAR</td> 
      <td class="value"><span>3.1</span></td> 
      <td class="value"><span>3.1</span></td> 

     </tr> 
     <tr id="fixed"> 
      <td class="flags"><img src="flags/EUR.png" /></td> 
      <td>EUR</td> 
      <td>EURO</td> 
      <td class="value"><span>5.10</span></td> 
      <td class="value"><span>3.1</span></td> 
      </div> 
     <tr id="fixed"> 
      <td class="flags"><img src="flags/JPY.png" /></td> 
      <td>JPY</td> 
      <td>JAPANESE YEN</td> 
      <td class="value"><span>8.10</span></td> 
      <td class="value"><span>3.1</span></td> 

     </tr> 

     <tr class="hidden"> 
      <td class="flags"><img src="flags/CAD.png" /> </td> 
      <td>CAD</td> 
      <td>TEST1 DOLLAR</td> 
      <td class="value"><span>8.10</span></td> 
      <td class="value"><span>3.1</span></td> 
     </tr> 

     <tr class="hidden"> 
      <td class="flags"><img src="flags/CNY.png" /> </td> 
      <td>CNY</td> 
      <td>TEST2 YUAN</td> 
      <td class="value"><span>8.10</span></td> 
      <td class="value"><span>3.1</span></td> 
     </tr> 
     <tr class="hidden"> 
      <td class="flags"><img src="flags/USD.png" /> </td> 
      <td>CAD</td> 
      <td>TEST3 DOLLAR</td> 
      <td class="value"><span>8.10</span></td> 
      <td class="value"><span>3.1</span></td> 
     </tr> 

     <tr class="hidden"> 
      <td class="flags"><img src="flags/CAD.png" /> </td> 
      <td>CAD</td> 
      <td>TEST4 DOLLAR</td> 
      <td class="value"><span>8.10</span></td> 
      <td class="value"><span>3.1</span></td> 
     </tr> 

     <tr class="hidden" > 
      <td class="flags"><img src="flags/CNY.png" /> </td> 
      <td>CNY</td> 
      <td>TEST5 YUAN</td> 
      <td class="value"><span>8.10</span></td> 
      <td class="value"><span>3.1</span></td> 
     </tr> 
     <tr class="hidden"> 
      <td class="flags"><img src="flags/USD.png" /> </td> 
      <td>CAD</td> 
      <td>TEST6 DOLLAR</td> 
      <td class="value"><span>8.10</span></td> 
      <td class="value"><span>3.1</span></td> 
     </tr> 

    </tbody> 
</table>

來源

2011-01-21 Khan

The jQuery API顯示，你可以用 '慢' '快' 或數字作爲參數的大部分（如果不是全部）的時間值。「show」和「slideDown」方法大致相同。

因此，也許你的選擇其實沒有任何回報？

嘗試：

var selector = $("tbody tr.hidden:hidden").filter(":eq(" + a + "), :eq(" + b + "), :eq(" + c + ")"); 
alert(sizeof(selector));

，以確保您選擇一些元素

編輯：

試試這個

$.each($("tbody tr.hidden:hidden").filter(":eq(" + a + "), :eq(" + b + "), :eq(" + c + ")"),function(i,val){ 
      $(this).show(750); 
     });

來源

2011-01-21 11:28:22

嗯更換setTimeout("ticker()", 2000);，這實際上並沒有做什麼？至少彈出 – Khan 2011-01-21 11:34:33

？如果它沒有，我猜你的代碼甚至沒有得到。如果那樣，它是你必須改變你的選擇 – 2011-01-21 11:39:42

沒有彈出0，嘗試了簡單的alert（「你好」）;它的工作原理，所以代碼是好的？答上面說不可能有TR元素的影響 – Khan 2011-01-21 11:48:43

有一些事情，不會有工作一個tr。嘗試做同樣的事情，只使用行中的td和th元素。

來源

2011-01-21 11:31:49 abesto

嘗試setInterval("ticker()", 2000);

來源

2011-01-21 11:41:49

jQuery show（）動畫或效果？

回答

相關問題