添加带有图像的悬停效果（wordpress）

Posted 2023-03-06

【中文标题】添加带有图像的悬停效果（wordpress）

【英文标题】：Add Hover Effect with Images (wordpress)

【发布时间】：2012-01-21 17:20:34

【问题描述】：

将图像透明度 - 悬停效果添加到 wordpress 的最佳解决方案是什么？我有几个公司的标志，我想让它们褪色，直到你将鼠标悬停在它们上面……有一个简单的解决方案吗？正在寻找正确的代码和 css...非常感谢。

【问题讨论】：

您愿意实现一个 javascript 解决方案，还是只是在寻找纯 CSS 解决方案？

【参考方案1】：

首先为您的所有公司徽标图像定义一个类 -

<img class="company-logo" src="..."/>

然后像这样为 company-logo 类添加 CSS -

img.company-logo 
    opacity: 0.5; /* Set this to whatever value you want */
    filter: alpha(opacity=50);


img.company-logo:hover 
    opacity: 1; /* make the images fully opaque */
    filter: alpha(opacity=100);

【讨论】：

这没用...快疯了...呃...这是我的网站me.lt/3Q3cq - 尝试将其添加到我的山脚图片...让我知道？