Question

请如何为链接<a href=""设置jQuery .cycle（）插件以循环幻灯片NAME？实施例。

<div id="slides">
<div name="slide_blue"> content of slide name slide_blue</div>
<div name="slide_red"> content of slide name slide_red</div>
</div>

我需要创作链接：

<a href=".cycle() to div name slide_blue">Blue<a>
<a href=".cycle() to div name slide_red">Red<a>

jQuery设置示例

$("#slides").cycle({
fx: 'ScrollHorz'
});

abybody可以帮我创建设置幻灯片循环名称的链接吗？

Answer 1

直播DEMO && code

像这样，根据您的需要进行修改：

<div id="slides">
<div name="slide_blue"> content of slide name slide_blue</div>
<div name="slide_red"> content of slide name slide_red</div>
<div name="slide_yellow"> content of slide name slide_yellow</div>
</div>

<div>
    <a href=".cycle() to div name slide_blue" class="slide_blue">Blue<a>
    <a href=".cycle() to div name slide_red" class="slide_red">Red<a>
    <a href=".cycle() to div name slide_yellow" class="slide_yellow">Yellow<a>
</div>

<script>
(function() {

    $("#slides").cycle({
       fx: 'scrollRight'
    });

    var cycleTo = function() {
        var className = $(this).attr('class');
        var divSelected = $('#slides div[name='+className+']');
        var slideIndex = $('#slides div').index(divSelected);
        $('#slides').cycle(slideIndex); 
        return false; 
    }

    $('div a').click(cycleTo); 

}())
</script>

jQuery cycle（）转到页面名称？

1 个答案: