根据链接 url 禁用图像悬停答案

【问题标题】：Disable hover on image depending on link url根据链接 url 禁用图像悬停
【发布时间】：2017-10-02 18:50:08
【问题描述】：

我有一个使用 Envira Gallery 插件创建的 wordpress 画廊。我需要为那些没有链接到任何页面并且以“#”作为 url 的图像禁用悬停。有没有办法禁用带有“#”url的图像的任何悬停效果？

提前谢谢你。

【问题讨论】：

你可以使用img[href="#"]作为选择器。
我必须分配一个类以仅将悬停修改为具有“#”作为 url 的图像。我该如何使用您的解决方案？
bhansa 在下面做了一个例子。

标签： javascript php jquery wordpress

【解决方案1】：

改用 jquery 解决方案。

您可以使用 jquery hover() 方法覆盖您的 css 样式。您可以为mouseenter() 和mouseleave() 指定css

使用a[href*="#"] > img 作为选择器，将具有href="#" 的所有链接定位到图像。

$('a[href*="#"] > img').hover(
  function() {
    $(this).css('background', 'blue');
  },

  function() {
    $(this).css('background', '');
  }
);

a:hover {
  background: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>


<a href="#"><img src="#" alt="image" /></a>

<a href="https://stackoverflow.com"><img src="" alt="ref image" /></a>

<a href="#"> Only link withuout image</a>

【讨论】：

对不起，我不擅长 javascript。我可以用“img[href*="#"]”代替“img[src*="#"]”吗？
img 有 src 属性，链接有 href。所以使用 src。
但是我的 img 来自一个使用 envira 画廊插件创建的画廊，所以 src 属性不是 # 而是 img 的来源。
@Luca 对不起，我误判了这个问题，我已经更新了解决方案。请检查。如果这解决了问题，请考虑接受或投票。谢谢。