使图像滑块自动工作

Question

我在网页中导入了一个图像滑块。它工作正常，但不能自动工作。我尝试添加一些jquery，使图像在4秒后发生更改，但由于某种原因，它只工作一次，并转到列表中的最后一个图像。有人能告诉我哪里出了问题，并帮助我让滑块自己工作吗。

这是标记。。。

<ul id="body">
<input type="radio" name="radio-btn" id="img-1" checked />
<li id="img-container">
    <div id="img-inner">
        <img src="file:///C:/smilburn/Practices/images/blackscale.jpg">
    </div>
    <label for="img-6" class="sb-bignav" title="Previous">&#x2039;</label>
    <label for="img-2" class="sb-bignav" title="Next">&#x203a;</label>
</li>
<input type="radio" name="radio-btn" id="img-2" />
<li id="img-container">
    <div id="img-inner">
        <img src="file:///C:/smilburn/Practices/images/huf.jpg">
    </div>
    <label for="img-1" class="sb-bignav" title="Previous">&#x2039;</label>
    <label for="img-3" class="sb-bignav" title="Next">&#x203a;</label>
</li>
<input type="radio" name="radio-btn" id="img-3" />
<li id="img-container">
    <div id="img-inner">
        <img src="file:///C:/smilburn/Practices/images/palace.jpg">
    </div>
    <label for="img-2" class="sb-bignav" title="Previous">&#x2039;</label>
    <label for="img-4" class="sb-bignav" title="Next">&#x203a;</label>
</li>
<input type="radio" name="radio-btn" id="img-4" />
<li id="img-container">
    <div id="img-inner">
        <img src="file:///C:/smilburn/Practices/images/skatecafe.jpg">
    </div>
    <label for="img-3" class="sb-bignav" title="Previous">&#x2039;</label>
    <label for="img-5" class="sb-bignav" title="Next">&#x203a;</label>
</li>
<input type="radio" name="radio-btn" id="img-5" />
<li id="img-container">
    <div id="img-inner">
        <img src="file:///C:/smilburn/Practices/images/only.jpg">
    </div>
    <label for="img-4" class="sb-bignav" title="Previous">&#x2039;</label>
    <label for="img-6" class="sb-bignav" title="Next">&#x203a;</label>
</li>
<input type="radio" name="radio-btn" id="img-6" />
<li id="img-container">
    <div id="img-inner">
        <img src="file:///C:/smilburn/Practices/images/supreme.jpg">
    </div>
    <label for="img-5" class="sb-bignav" title="Previous">&#x2039;</label>
    <label for="img-7" class="sb-bignav" title="Next">&#x203a;</label>
</li>
<input type="radio" name="radio-btn" id="img-7" />
<li id="img-container">
    <div id="img-inner">
        <img src="file:///C:/smilburn/Practices/images/adidas.jpg">
    </div>
    <label for="img-6" class="sb-bignav" title="Previous">&#x2039;</label>
    <label for="img-8" class="sb-bignav" title="Next">&#x203a;</label>
</li>

这是我添加的jquery。。

function gogo(){
    $('label[title="Next"]').click();
}
$(document).ready(function () {
    setInterval('gogo()',4000);
});

Answer 1

试试这个。。易于使用滑块插件

http://bxslider.com/

或者这个

http://rhinoslider.com