0

こんにちは: 次の画像を 1 つずつドロップダウンすることは可能でしょうか。現在、最初のものがクリックされると、両方が一度にドロップされます。removeClass を使用してみましたが、結果はありませんでした。

表示しようとしている画像が 2 つあるため、コードが 2 回表示されます。どちらも最初はサムネイルで、興味があればクリックすると大きな画像が表示されます。見終わったら、画像をクリックして削除し、画像 2 を見て同じ機会を得ることができます。サムネイルよりも大きなものを見たい場合は、サムネイルをクリックします。問題は、最初 (または 2 番目) のサムネイルをクリックすると、両方の大きな画像が一度に拡大し、その後両方が再び収縮することです。これが明確であることを願っています。必要に応じてさらに明確にすることができます。ありがとう

<div class="JQuery"><!--Begin JQuery-->
<div class="clickMeA"><img src="images/1.jpg" width="124" height="90" /></div>
<div class="picframeA"><img src="images/1LG.jpg"><p>Here is the text</p></div>
  <script src="jquery-1.7.2.min.js"></script>
  <script>
    $(document) .ready(function(){                  
            $(".clickMeA"). click(function() {                                            
            $("img") .fadeIn(1000);
            $(".picframeA") .slideToggle("slow");
        });
    });
    </script>
<div class="clickMeA"><img src="images/2.jpg" width="124" height="90" /></div>
<div class="picframeA"><img src="images/2LG.jpg"><p>Here is the text</p></div>
  <script src="jquery-1.7.2.min.js"></script>
  <script>
    $(document) .ready(function(){                  
            $(".clickMeA"). click(function() {
            $("img") .fadeIn(1000);
            $(".picframeA") .slideToggle("slow");
        });
    });
    </script>
</div>
4

1 に答える 1

0 
$(".clickMeA")

これにより、 class を持つすべての要素が取得されますclickMeA。

$("img")

これにより、ページ上のすべての <img>タグが取得されます。

スクリプトと jQueryを一度だけ含める必要があります。スクリプトを に配置する必要があります<head>。各 div の後にスクリプト全体をコピーして貼り付ける必要があります。

スクリプトは DOM の準備が整うまで実行されないため、スクリプトが必要になるのは 1 回だけで、一致したすべての要素に影響します。

$(document).ready(function(){ // runs after the DOM is ready
    $(".clickMeA").click(function(){ // gets all elements with that class
        // why are you fading in before sliding the div?
        $(this).next(".picframeA").find("img").fadeIn(1000); // target the correct image
        $(this).next(".picframeA").slideToggle("slow"); // target the correct div
    });
});

デモ: http://jsfiddle.net/yngEQ/1/

于 2012-05-17T21:35:36.030 に答える