0

私は自分のサイトの次の投稿でサムネイル付きのギャラリースクリプトを使用しています

http://www.lookbookcookbook.com/2012/03/apple-cinnamon-pancakes.html

正常に動作しますが、メインページ（3番目の投稿）に移動すると、動作を停止します。同じスクリプトで干渉している別の投稿があるからですか？

どんな助けでも大歓迎です、ありがとう！

4

1 に答える 1

0

スクリプトは id を使用して、表示する画像をターゲットにしています。ID は一意である必要があり、特定の ID を持つことができる要素は 1 つだけです。

あなたの 2 つのギャラリーの画像は、#pic-0、#pic-1 などの同じ ID を共有しています。したがって、クリックすると、最初に見つかった画像、最初のギャラリーの画像のみが表示されます。

解決するのはそれほど難しいことではありませんが、コードの多くは CMS で生成する必要があるため、何を変更すればもっと役立つかを知る必要があります。

(これは、ギャラリーを処理するコードの一部です:)

function myshowImages(id) {
 /* $(".mainPic").hide(); 
$("#pic-"+id).show();*/ 
$('.mainPic').css({'display':'none'}); 
$("#pic-"+id).fadeIn('slow');  
}

コメントの後に編集:

正直なところ、あなたのコードは少し混乱しています。きれいなものを実現するには、多くの変更が必要です。ただし、すぐに必要な場合は、次の 2 つの showImage 関数を使用する必要があります。

function myshowImages1(id) {
$('.mainPic1').css({'display':'none'}); 
$("#pic-"+id).fadeIn('slow');  
}

function myshowImages2(id) {
$('.mainPic2').css({'display':'none'}); 
$("#pic-"+id).fadeIn('slow');  
}

リンクを編集します: 最初のギャラリー用。2番目のもの。

見苦しく、スケーラブルではないことに注意してください。ギャラリーが 3 つあると、壊れてしまいます。あなたのコードを見て、独自の機能を実現する方法を確認します。

編集2：

したがって、使用するクリーナー関数は次のとおりです。

1/ setup : 各リンク/画像ペアのクラス名を選択しました。例:

<a href="" class="image_1">
<img alt="" height="80" src="(some long path)/lookbookcookbooksaya267b.jpg" title="" width="80">
</a>

サムリンクと表示する画像:

<a href="(some long path)/lookbookcookbooksaya267.jpg">
<img alt="" class="image_1" height="470" src="(some long path)/lookbookcookbooksaya267.jpg"></a>

それから、私はあなたがJQueryを持っているのを見たので、この種の関数:

$(document).ready(function()
{
     $(".gallery div div a").on("click",function()
     {
     var myClass = $(this).attr('class');
     var $parentGallery = $(this).parents('.gallery');
     $parentGallery.find("div > a > img").css("display","none").find("myClass").fadeIn();
     return false;
    });
});

まず、.gallery 要素の 2 div の深さであるすべてのリンクにクリック イベントをバインドします。それはあなたの親指です。クリックすると、クリックされたサム リンクのクラスが取得されます。次に、このリンクの親 .gallery を検索し、すべての画像を非表示にして、適切な画像を表示します。

マークアップが非常に複雑であるため、ボックスで問題なく動作することを保証することはできませんが、問題なく動作するはずです。

于 2012-04-05T23:24:21.087 に答える