Question

在Wordpress网站中，我需要从某些缩略图中禁用点击，当鼠标悬停在页面http://srougi.biz/gb/produtos中时保持叠加效果。我没有办法做到这一点。

Answer 1

使用Javascript在缩略图上禁用onclick（）事件，并将效果保留在onmouseover（）事件中。

阅读以下链接：http://www.htmlgoodies.com/beyond/javascript/article.php/3470771

让我们假设您的缩略图是图像。以下是你的HTML：

<img id="thumbnail" src="sourcefile.jpg" OnMouseOver="MouseOverEvent()" OnClick="return false;"/>

以下是您的javascript元素（您可以将其添加到带有标记的html文件中）

<script>
function OnMouseOverEvent()
{
//you can set your effects here
}
</script>

Answer 2

您目前正在该页面上使用jQuery。也许这可行。

jQuery('div.thumbail > a').unbind('click');

Answer 3

从标记中删除hrf

<a href="http://srougi.biz/gb/portfolio/acessorios/" title="Acessórios">

更改为

<a title="Acessórios">

Answer 4

正如其他人所提到的，您无法处理CSS中的点击事件。如果您想要禁用所有缩略图的点击次数，请使用jQuery（为简单起见），您可以将其直接添加到网站的头部：

<script src="path/to/your/jquery.js"></script>

<script>

    (function($) {

        // find all 'a' elements inside of the 'thumbnail' class
        var block_click = $('.thumbnail').find('a'); 

        // function to create the new behavior you want to achieve
        function prevent_default_click_behavior(e) {

            // You can use this
            e.preventDefault();

            // Or this method
            return false;

        }

        // then, bind the desired behavior to the elements click event
        block_click.on('click', prevent_default_click_behavior);

    })(jQuery);

</script>

如果要禁用某些图像上的链接，并将其保留给其他人，则可以使用其他类来指定两者之间的链接。一个简单的实现可能如下所示：

<div class="thumbnail stop-click">
  <a href="#">
    <img src="src/to/image/jpg" alt="">
  </a>
</div>

现在使用javascript，我可以通过“停止点击”课轻松地对所有缩略图说“使用我的行为”。

<script>

    (function($) {

        // all 'a' elements inside the 'thumbnail' class that also has the 'stop-click' class
        var block_click = $('.thumbnail.stop-click').find('a'); 

        // function to create the new behavior you want to achieve
        function prevent_default_click_behavior(e) {

            // You can use this
            e.preventDefault();

            // Or this method
            return false;

        }    

        // then, bind the desired behavior to the elements click event
        block_click.on('click', prevent_default_click_behavior);

    })(jQuery);

</script>

如何禁用点击但保留叠加效果

4 个答案: