使用Wordpress中的jQuery更改悬停时其他元素的不透明度

Question

我想在我的Wordpress网站上使用jQuery更改悬停上其他元素的不透明度。

这是一个例子： http://www.casinotitan.im/（firefox提供最佳结果）

<div class="container">

<div class="example">
    <img src="example.png" alt=".." class="img-example" />
</div>

<div class="example">
    <img src="example.png" alt=".." class="img-example" />
</div>

<div class="example">
    <img src="example.png" alt=".." class="img-example" />
</div>

我还想将此脚本插入Wordpress页面（我的主页）， 但我不明白启动和运行jQuery的过程是什么。

Answer 1

这应该做的工作：

$(".example").hover(function() {
    $(".example").not($(this)).toggleClass("translucent");
});

CSS：

.translucent {
    opacity: 0.2;
}

您可以在http://jsfiddle.net/sUnh8/1/

中看到它的实际效果

检查@maxzeroedge关于如何启动和运行jQuery的注释。