Question

我正在使用以下jQuery脚本进行幻灯片放映。我遇到的问题是页面最初加载时会短暂闪烁队列中的下一张幻灯片。我怎么能防止这种情况发生？我的代码来自：http://snook.ca/archives/javascript/simplest-jquery-slideshow

jQuery('#welcome div:gt(0)').hide();
 setInterval(function(){
   jQuery('#welcome :first').hide()
      .next('.slidey').fadeIn()
      .end().appendTo('#welcome');}, 
   5000);


<script src="scripts.js"></script>

<div id="welcome">

<div class="slidey">
    <h1>Example.com</h1>
    <br />
    <a href="http://www.example.com/about">Learn More</a>
</div>

<div class="slidey">

    <h1>The best widgets in the world...</h1>

    <br />

    <a href="http://www.example.com/buywidget">Buy Widget</a>

</div>

全部，我决定使用此幻灯片代码：http://www.webchief.co.uk/blog/simple-jquery-slideshow/index.php它有更多功能......

Answer 1

您是否尝试将该功能添加到document.ready？（http://api.jquery.com/ready/）

$(document).ready( [your functions] )

修改的

如果你想隐藏div，请使用css：

style="display:none">

Answer 2

你是第一个吗？我之前看过这个：

jQuery(function($) {
    $('#welcome div:gt(0)').hide();
    setInterval(function(){
        $('#welcome :first').hide()
            .next('.slidey').fadeIn()
            .end().appendTo('#welcome');
    }, 5000);
});

jQuery幻灯片显示页面加载时的其他幻灯片？

2 个答案: