如何隐藏描述区域并使其在您单击照片时出现？

Question

所以，我的网站上有两张照片。每张图片下方都有一个描述框。当您单击描述框时，会出现该产品的描述。但是，我希望在您单击图片本身时出现描述框，而不是在您单击描述框时出现。我已经添加了一个例子来说明我的意思，但该网站使用的是 Shopify。我想知道类似的东西是否可以在 wordpress 上使用以及如何使用？

Like this

Answer 1

您可以为此使用脚本。

<script type="text/javascript">
        function showImageDesc(obj) {
        var inner = obj.parentNode.getElementsByTagName("div")[0];
        if (inner.style.display == "none")
            inner.style.display = "";
        else
            inner.style.display = "none";
        }
    </script>

<div class="image-block">
    <img onclick="showImageDesc(this);" src="yourimage.jpg" />
    <div class="inner" style="display:none;">
        Here is your image description
    </div>
</div>

如何隐藏描述区域并使其在您单击照片时出现？

How to hide a description area and make it appear when you click on the photo?

wordpress

wordpress-theming