1

我正在尝试在我的照片滑块上应用过度效果。我有以下代码结构：

<div class="corpo_itens">
    <div class="foto-carousel">
        <div class="transparencia">
            <span>A Novilha Rebelde (The Sound of Mu)</span>
            <br /><br />
            Elisa Queiroz e Erly Vieira Jr., 18 min, Vitória (ES), 2005
        </div>
        <img src="img/foto_carousel1.jpg" alt="Nome da foto" />
        <div class="icon-foto"><img src="img/icon_video.png" alt="Vídeo" /></div>
    </div>
    <div class="clear"></div>
</div>

我要做的是在鼠标悬停图像时淡入和淡出“transparencia” div。这个滑块有不同的图像，并且使用以下代码它可以工作，但它同时隐藏和显示所有 div...我不知道如何解决它...

$('.foto-carousel').hover(
 function () {$('.transparencia').css({"display":"block"});}, 
 function () {$('.transparencia').css({"display":"none"});}
);
4

2 回答 2

1

如果您只想隐藏/显示.transparencia悬停的内部，则.foto-carousel必须指定上下文，例如

$('.foto-carousel').hover(
    function () {$('.transparencia', this).css({"display":"block"});}, 
    function () {$('.transparencia', this).css({"display":"none"});}
);
于 2012-07-26T03:14:26.593 回答
0 
$(".corpo_itens img").onmouseover(function(){
  $(this).parent().children(".transparencia").fadeIn(100);
});
$(".corpo_itens img").onmouseout(function(){
  $(this).parent().children(".transparencia").fadeOut(100);
});

或者类似的东西。

于 2012-07-26T03:13:25.983 回答