0

http://jonraasch.com/blog/a-simple-jquery-slideshowから Jquery Slideshow を取得しました 。すべて正常に動作しています。div 内の各画像にハイパーリンクを配置したいのですが、その中に ahrefs を配置すると、最初の画像のみが表示され、他の画像は表示されません。

サンプルはリンク内にあります: http://jonraasch.com/blog/a-simple-jquery-slideshow

注:スライドショーのすべての画像に異なるリンクが必要です。

4

2 に答える 2

3

each関数を使用できます。

var images = $('#slideshow').children('img');
$.each(images,function(){
   images.wrap('<a href="#"></a>');
});

注: このコードを自分で試したことはありません。ごめん。

于 2013-02-11T10:44:50.353 に答える
0

これを試して :-

-----jsの変更----

    var $active = $('#slideshow a.active');

    if ( $active.length == 0 ) $active = $('#slideshow a:last');

    // use this to pull the images in the order they appear in the markup
    var $next =  $active.next().length ? $active.next()
        : $('#slideshow a:first');

------変更はcssです-------

/*** set the width and height to match your images **/

#slideshow {
    position:relative;
    height:350px;
}

#slideshow a {
    position:absolute;
    top:0;
    left:0;
    z-index:8;
    opacity:0.0;
}

#slideshow a.active {
    z-index:10;
    opacity:1.0;
}

#slideshow a.last-active {
    z-index:9;
}

</style>

---htmlの変更---

<div id="slideshow">
   <a href="#"> <img src="image1.jpg" alt="Slideshow Image 1" class="active" /></a>
    <a href="#"> <img src="image2.jpg" alt="Slideshow Image 2" /></a>
    <a href="#"> <img src="image3.jpg" alt="Slideshow Image 3" /></a>
    <a href="#"> <img src="image4.jpg" alt="Slideshow Image 4" /></a>
</div>
于 2013-02-11T10:52:32.757 に答える