2011-03-07 182 views
0

下面的JavaScript會每6000毫秒在標記中顯示一個blockquote。我想改變這種行爲,只顯示每頁加載。我可以將它們全部加載到標記中,我只想在每個頁面加載中隨機選擇一個。如何顯示多個頁面的每個頁面刷新?

<script type="text/javascript"> 
jQuery(document).ready(function(){ 
    jQuery('.quotes').innerfade({ 
     animationtype: 'fade', 
     speed: 'normal', 
     timeout: 6000, 
     type: 'random_start', 
    }); 

}); 
</script> 

作爲獎勵,如果在瀏覽器中禁用JavaScript,我只想顯示一個。

<div class="quotes innerfade" style="position: relative; height: 277px;"> 
    <div class="quote" style="z-index: 8; position: absolute; display: none;"> 
     <blockquote><p>「Throw out costs by more than 50%.」</p></blockquote> 
         <cite>Da John @ Con Pi LLC</cite> 
        </div> 

        <div class="quote" style="z-index: 7; position: absolute; display: none;"> 
         <blockquote><p>「Georgio pany.」</p> 
</blockquote> 
         <cite>Kn Maez, Mnet</cite> 
        </div> 

        <div class="quote" style="z-index: 6; position: absolute; display: block;"> 
         <blockquote><p>「…He hae is available.」</p> 
</blockquote> 
         <cite>Dan net</cite> 
        </div> 

        <div class="quote" style="z-index: 5; position: absolute; display: none;"> 
         <blockquote><p>「Georommend without a doubt.」</p> 
</blockquote> 
         <cite>Jorge Suár Puerto Rico</cite> 
        </div> 

        <div class="quote" style="z-index: 4; position: absolute; display: none;"> 
         <blockquote><p>「Siain tomorrow…」</p> 
</blockquote> 
         <cite>Cha, Inc.</cite> 
        </div> 
       </div> 

如果你想看到的網站,該代碼是你可以去http://www.kiragiannis.com看的網頁叫「推薦」

回答

4

可以使用基於單元長度上和隨機數的方法.eq()用下面的jQuery的:

var whichToShow = Math.floor(Math.random() * $('.quote').length); 

$('.quote').hide().eq(whichToShow).fadeIn(1000); 

Here's a fiddle demo.單擊「運行」,看新的隨機報價。

+0

爲小提琴網站+1,這是一個偉大的工具。 – Geo 2011-03-07 23:24:54

+0

你可以添加到你的答案如何去JS優雅失敗時禁用? – Geo 2011-03-08 00:02:02

+0

它已經確實失敗。只要將'display:block'分配給JS禁用時要顯示的引用即可。 – mVChr 2011-03-08 00:16:45

1

隱藏他們所有的右下部,並有它們的id爲quoteN,其中N是一個從0到nr的引號。然後使用math.random選擇一個N來顯示。構建id字符串並在文檔準備就緒時顯示它。

+0

並使用

相關問題