0

您好:我想知道是否可以一次下拉一张以下图片。目前,当单击第一个时,它们都会同时下降。我试过使用 removeClass 但没有任何结果。

该代码出现两次,因为我要显示两个图像。两者最初都是缩略图,然后如果该人感兴趣,他们会单击并出现更大的图像。完成查看后,他们可以单击并删除图像,然后查看图像 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 准备好之前不会执行,因此您只需要它一次,它将影响所有匹配的元素。

$(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 回答