下面的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,查看页面右下角的“推荐书”
答案 0 :(得分:4)
您可以使用基于元素长度的随机数和.eq()
方法以及以下jQuery:
var whichToShow = Math.floor(Math.random() * $('.quote').length);
$('.quote').hide().eq(whichToShow).fadeIn(1000);
Here's a fiddle demo.点击“运行”查看新的随机引用。
答案 1 :(得分:1)
隐藏它们全部,并使用id quoteN,其中N是0到nr引号之间的整数。然后使用math.random选择要显示的N.构建id字符串并在文档准备就绪时显示它。