1

このjqueryギャラリーを機能させることができないようです。.galleryImgsクリック関数を機能させることはできましたが、#gallery-nextクリック関数を機能させることができないようです。次の.galleryImgsdivからdata-src属性を取得し、それを.galleryImgsrcに設定することになっています。addClassとremoveClassを使用してみたので、どちらから始めればよいかはわかっていますが、それでも機能しません。すべての助けに感謝します。

<img class="galleryImgs" data-src="images/test-image-1.jpg" src="images/test-image-1-s.jpg" />
<img class="galleryImgs" data-src="images/test-image-2.jpg" src="images/test-image-2-s.jpg" />
<img class="galleryImgs" data-src="images/test-image-3.jpg" src="images/test-image-3-s.jpg" />
<img class="galleryImgs" data-src="images/test-image-4.jpg" src="images/test-image-4-s.jpg" />
<img class="galleryImgs" data-src="images/test-image-5.jpg" src="images/test-image-5-s.jpg" />

<img class="galleryImg" src="" />

<div id="gallery-next"></div>

<script type="text/javascript">
$(function(){
    $('.galleryImgs').click(function(){
        $('.gallery').show();
        $(this).addClass('catherine');
        var $galleryImg = $(this).attr("data-src");
        $('.galleryImg').fadeIn().attr("src", $galleryImg);
    });
    $('#gallery-next').click(function(){            
        $('.galleryImgs').hasClass('catherine').removeClass('catherine').next('.galleryImgs').addClass('catherine');
        var $galleryImg = $('.galleryImgs').hasClass('catherine').attr("data-src");
        $('.galleryImg').attr("src", $galleryImg);
    });
});
</script>
4

2 に答える 2

0

礼儀として、私はあなたの関数を書き直しました:

$('#gallery-next').click(function(){       
    var el = $('.galleryImgs.catherine');
    if(el.length <= 0){
        console.log('something is really wrong...');
    }   
    el.removeClass('catherine').next('.galleryImgs').addClass('catherine');
    $('.galleryImg').attr("src", $('.galleryImgs.catherine').data('src'));
});

私はこれを少し編集しました。もしそうなら、新しいコードを取ります。

于 2012-06-23T22:57:29.543 に答える
0

これはうまくいきました。

$('#gallery-next').click(function(){
        var $galleryImg = $('.galleryImgs.hidden').removeClass('hidden').closest('.galleryImgs').nextAll('.galleryImgs').eq(0).addClass('hidden').attr("data-src");
        $('.galleryImg').fadeIn().attr("src", $galleryImg);
    });
于 2012-06-23T23:13:14.337 に答える