Question

我是JQuery的总菜鸟，我的任务是完成一项超出我能力的项目。

我在其自己的div中有一系列图像，并带有相关的隐藏段落。我可以使用简单的显示/隐藏脚本来获取第一个div中的段落以正确显示和隐藏，但是一旦我将更多图像div添加到混合中，代码将仅打开第一个图像的<P>或全部{ {1}}立刻。

CLearly，我需要帮助集成EACH循环等效。

以下是代码：

<P>s

Answer 1

试试这个：

<script>
  $(document).ready(function(){
    $("img.showr").click(function () {
       $(this).next('p').show("slow");
    });
    $("img.hidr").click(function () {
      $(this).parent('p').hide(2000);
    });

  });
  </script>
<style>
div {
    padding:0;
    float:left;
    position:relative;
    top: 140px;
    text-align:center
}
p {
    background:#FFFFFF;
    margin:3px;
    width:300px;
    display:none;
    position:absolute;
    left:45%;
    top: -20px;
    text-align:left;
    z-index: 3000;
}
.over {
    z-index: 3000;
}
</style>
</head><body>
    <div id="belt">
        <div class="panel">
            <img src="images/1.jpg" name="showr" class="showr">
            <p>
                <img class="hidr over" src="images/1.jpg" width="300px" height="450px" alt="light1" /> <br />
                <br />
                Display item text description<br />
                $price
            </p>
        </div>
        <div class="panel"> 
            <img class="showr" src="images/2.jpg" width="200px" height="300px" alt="light1" />
            <p>
                <img class="hidr over" src="images/1.jpg" width="300px" height="450px" alt="light1" /> <br />
                <br />
                Display item text description<br />
                $price
            </p>
        </div>
    </div>
</body>
</html>

注意：我也改变了一些jQuery和标记。询问您是否需要任何帮助，或者它会中断：）

在一个div中的一系列图像上单独使用show hide

1 个答案: