Jquery 幻灯片放映的问题

Question

我熬夜只是想解决 JQuery 幻灯片，但我不确定为什么它没有按预期工作。我忘了拍下这个例子，但现在我的笔记本电脑不在身边，所以如果你需要看这个例子，我会在几个小时后发布。

我借用了插件的功能： http://medienfreunde.com/lab/innerfade/

    <script>

                   jQuery.noConflict();
                   $(document).ready( function(){
                   $('li#slider_reel').innerfade({
                   animationtype:'fade',
                   speed: 'slow',
                   timeout: 4000,
                   type: 'sequence',
                   containerheight: '648px'; });

                   });

                   </script>


    <div id="slider_view">
    <div id="slider_reel">

    <ul>
    <li><img src="slide/A.jpg"></li>
    <li><img src="slide/B.jpg"></li>
    <li><img src="slide/C.jpg"></li>
    <li><img src="slide/D.jpg"></li>
    </ul>
    </div>
    </div>
    <!--end reel-->

ul#slider_reel li img{
    border: 1px solid #ccc;
    padding: 4px;
}


.fade{
    margin-bottom: 2em;
}

.fade p{
    margin-bottom: 2em;
    text-align: center;
    width: 100%;
    background: #fff;
}

结果：所有图像以长的垂直顺序出现（就像彼此堆叠或一堆一样）。无法弄清楚为什么它会这样。预先感谢您的帮助

编辑 我的歉意。它确实有 ul 和 li - 我忘了将它们添加到里面。得到了相同的结果。

编辑二 我终于让它工作了。我想我错过了一些“}”或其他东西，而且我用实际文件而不是 href 替换了脚本。

非常感谢您的帮助！

Answer 1

我已经让它工作了，
http://jsfiddle.net/BceNn/6/

问题之一：

containerheight: '648px'; /*REMOVE THIS SEMICOLON*/ });/*REMOVE THIS SEMICOLON*/

编辑：这里正在工作代码。

<script type="text/javascript">
$(document).ready( function(){
    $('#slider_reel').innerfade({
        animationtype:'fade',
        speed: 'slow',
        timeout: 4000,
        type: 'sequence',
        containerheight: '648px' 
    })
});
</script>


    <ul id="slider_reel">
    <li><img src="slide/A.jpg"></li>
    <li><img src="slide/B.jpg"></li>
    <li><img src="slide/C.jpg"></li>
    <li><img src="slide/D.jpg"></li>
    </ul>

Answer 2

修复您的选择器，其中没有 UL 或 LI，然后重试

Answer 3

问题可能就在这里，在你的 CSS 中：

ul#slider_reel li img{
    border: 1px solid #ccc;
    padding: 4px;
}

复制+粘贴代码不是一个好主意。此规则根本不适用，因为您没有任何 id 为 slider_reel 的 ul 元素。您有 div 标签。

我会尝试事先隐藏图像，然后运行它：

$('#slider_reel img').hide();
// Innerfade code