Javascript 鼠标悬停淡入嵌入式img或目标特定类

使用js/jQuery是否可以只淡入嵌入的图像而不是div以显示div背景图像？我有以下类的多个实例，只想影响对所选类的更改

e、 g:

谢谢

已解决

按照建议使用find（）并将图像包装到一个额外的类中，从而使其正常工作。现在图像淡入淡出。图像的背景像素图案通过以下方式混合：

<div class="box">
        <div class="image"><div class="p"><img src="pics/001.jpg"/></div></div>
        <div class="project">Title</div>
</div>

$('.box').mouseover(function() {  
     $(this).find('.p').stop().animate({opacity:.3}, 200);
     $(this).find('.project').css({color:'#FFF'});
});

$('.box').mouseout(function() {
    $(this).find('.p').stop().animate({opacity:1}, 600);   
    $(this).find('.project').css({color:'#FFF'});
});

标题
$（'.box'）.mouseover（函数（）{
$（this.find（'.p'）.stop（）.animate（{opacity:.3}，200）；
$（this.find（'.project'）.css（{color:'#FFF'}）；
});
$（'.box'）.mouseout（函数（）{
$（this.find（'.p'）.stop（）.animate（{opacity:1}，600）；
$（this.find（'.project'）.css（{color:'#FFF'}）；
});

干杯

您可以使用：

尝试查看jQuery选择器的属性

基本上：

$('.image').mouseover(function() {  $('img',this).stop().animate({opacity:.7}, 200); });

---

这将选择触发鼠标悬停的元素中的img元素。

使用jQuery的内置淡入淡出

    $('.image').hover(function() {  // on mouseover 
         $(this).stop().fadeTo(200, 0.7); 
    }, function(){                  // on mouseout
         $(this).stop().fadeTo(600, 1); 
    });

此外，为了解决div中的特定项，您可以使用

---

“在内部，选择器上下文是用.find（）方法实现的，因此$（“span”，this）相当于$（this）.find（“span”）。”因此直接使用它更好（但不会影响性能）。find（）fadeOut（）将不透明度设置为0。OP希望衰减到0.7。所以最好是使用fadeTo（），我会使用Toggle而不是fade，当然是首选项

$('.image').mouseover(function() {  $(this).next('.project').css({color:'#FFF'}); });

$('.image').mouseover(function() {  $('img',this).stop().animate({opacity:.7}, 200); });

    $('.image').hover(function() {  // on mouseover 
         $(this).stop().fadeTo(200, 0.7); 
    }, function(){                  // on mouseout
         $(this).stop().fadeTo(600, 1); 
    });

$('.box').mouseover(function(){
  $(this).find('.image').animate({...}); // will animate .image when you hover .box
});