0

このページのスライドショーにはjQueryCycleを使用しました：http ：//energync.ehclients.com/そして、その下のページャーイベントにマウスを合わせると画像が変化するように設定しました。これらのリンクはjQueryによって動的に作成されるため、サイトの他のページへのリンクを追加するにはどうすればよいですか？

これがhtmlです：

<div id="slideshow">
<img src="http://energync.ehclients.com/images/uploads/slideshow-1.jpg" alt="Making Energy Work" width="645" height="333">
<img src="http://energync.ehclients.com/images/uploads/slideshow-2.jpg" alt="We Collaborate" width="645" height="333">
<img src="http://energync.ehclients.com/images/uploads/slideshow-3.jpg" alt="We Analyze" width="645" height="333">
<img src="http://energync.ehclients.com/images/uploads/slideshow-4.jpg" alt="We Advocate" width="645" height="333">
<img src="http://energync.ehclients.com/images/uploads/slideshow-5.jpg" alt="We Educate" width="645" height="333">
</div>

jQueryは次のとおりです。

$('#slideshow').cycle({
    fx: 'fade',
    pager : '#slideshow-nav',
    pagerEvent: 'mouseover',
    speed: 2000,
    delay:  3000,
});
4

1 に答える 1

2

jQuery Cycleマニュアルから：

pagerAnchorBuilder: null, // callback fn for building anchor links:  function(index, DOMelement)

まず、pagerAnchorBuilderを定義する必要があります。これにより、リンクに使用する要素がスクリプトに通知されるため、それらは自動生成されなくなります。また、allowPagerClickBubbleを追加して、クリック時にデフォルトのアクション（ページURL）がトリガーされるようにする必要があります。

$('#slideshow').cycle({
    fx:     'fade',
    speed:  2000,
    delay: 3000,
    pager : '#slideshow-nav',
    pagerEvent: 'mouseover',
    pagerAnchorBuilder: function(idx, slide) {
        // return sel string for existing anchor
        return '#slideshow-nav ul li:eq(' + (idx) + ') a';
    },
    allowPagerClickBubble: true
});

次に、HTMLコードで次のようにします。

    <div id="slideshow-nav">
             <ul>
            <li class="collaborate"><a href="">We Collaborate</a></li>
            <li class="analyze"><a href="">We Analyze</a></li>
            <li class="advocate"><a href="">We Advocate</a></li>
            <li class="educate"><a href="http://energync.ehclients.com/we-educate/">We Educate</a></li>
             </ul>
    </div>

そのブロックの残りのアンカーにURLを追加すると、機能します。

作業デモ（最後のリンクをクリック）：JSfiddle

于 2013-01-03T19:11:44.700 に答える