0

我有一个成对的文本图像列表,我希望循环遍历它。如果我没有任何其他特定需求,那也没关系。

但是,如果我希望显示此列表的所有元素而不是循环所有元素怎么办?

我尝试了slideExpr选项,但我想这不是我的情况。我找不到任何线索,是我遗漏了什么还是没有这个选项?

编辑:

我想要获得的是显示所有四个文本链接,但只有其中两个被选中用于循环,并且只显示循环图像。

HTML:

<div id="slideshow">
<img class="presentImage" src="http://jquery.malsup.com/cycle/images/beach1.jpg" width="200" height="200" />
<img class="" src="http://jquery.malsup.com/cycle/images/beach2.jpg" width="200" height="200" />
<img class=""  src="http://jquery.malsup.com/cycle/images/beach3.jpg" width="200" height="200" />
<img class="presentImage" src="http://jquery.malsup.com/cycle/images/beach4.jpg" width="200" height="200" />

JS:

$(document).ready(
    function()
    {  
        var str = '<h2 class="clienti">xxxxx</h2>'+
            '<div id="past_clients" style="padding-top:60px; height:435px;">';
        var titles =
            [   '<div><h3 style="margin-top:0;">yyyyy</h3><a class="client" href="#" style="width:130px; display:block;">&bull; img 1</a></div>',
             '<div><a class="client" href="#">&bull; img2</a></div>',
             '<div><a class="client" href="#">&bull; img3</a></div>',
             '<div><a class="client" href="#">&bull; img4</a></div></div>'
            ];
        $('#slideshow').before(str).cycle({
            fx:     'fade',
            speed:  'fast',
            timeout: 2000,
            slideExpr: '.presentImage',
            pager: '#past_clients',
            pagerAnchorBuilder: function (index) { return titles[index]; }
        });
    }
);

在这里你可以找到它:谢谢

4

2 回答 2

1

这是一个使用 slideExpr 的示例:

CSS

img {
    position:relative;
    left:200px;
}

HTML

<div id="slideshow" class="pics"> 
    <font size="-1"> 
        <img class="test" src="http://jquery.malsup.com/cycle/images/beach1.jpg" width="200" height="200" /> 
        <img src="http://jquery.malsup.com/cycle/images/beach2.jpg" width="200" height="200" /> 
        <img class="test" src="http://jquery.malsup.com/cycle/images/beach3.jpg" width="200" height="200" /> 
    </font> 
</div>

Javascript

$('#slideshow').cycle({ slideExpr: '.test' });

和小提琴:http: //jsfiddle.net/wgN8x/

我添加了 css 以使图像可见,否则未循环的图像将隐藏在两个图像后面。

编辑:更新

刚刚注意到OP已经更新了这个问题。我修改了小提琴以反映关键点:

  1. 仅显示循环中的图像(CSS)
  2. 必须显示所有锚点 (JS)
  3. 锚点应该链接到它们的索引等效图像。IE。即使循环中只有两个图像,第四个锚点也会触发标记中的第四个图像。我不确定这是一个要求,但对我来说很有意义。您可以在小提琴中看到这一点。

这是我的更新:http: //jsfiddle.net/lnrb0b/MEN7Y/43/

于 2013-02-04T09:07:57.240 回答
0

检查每个 jquery 函数。

。每个()

于 2013-02-04T08:54:11.430 回答