jquery - Div 在图像上和鼠标悬停事件

Question

我有一个带有图片的网站，其中一些图片有一个“播放”(绝对定位的 div 并通过 jQuery 上的点击事件管理)。

在某些图像中，当鼠标悬停在图像上时，我必须更改不透明度。

当图像同时具有“播放”和不透明度变化时，就会发生这种情况(将鼠标放在“播放”div 上):http://jsfiddle.net/S53b5/

我尝试了不同的解决方案，仅使用 CSS 或使用 jQuery，但一切都有效 :(

谢谢!

Answer 1

试试这个 demo

   $("img").mouseout(function(){
     $(".play").css("opacity","1")
    }).mouseover(function(){
     $(".play").css("opacity",".5");
    });

已更新 Demo2

$("img").mouseout(function(){
        $(".play").css("opacity","1");
         $(this).css("opacity",".1");
    }).mouseover(function(){
        $(".play").css("opacity",".5");
        $(this).css("opacity","1");
    });

$(".play").mouseover(function(){
        $(this).css("opacity","1");
        $("img").css("opacity","1");
    });