将jquery悬停在类中的第一个图像上

我想在悬停状态下切换div类的图像/文本

<div class="fif">
  <img src="img/img1.jpg">
  <div id="pmask">
     some text or image 1
  </div>
</div>
<div class="fif">
  <img src="img/img2.jpg">
  <div id="pmask">
     some text or image 2
  </div>
</div>

但是那不行。

试试这个（没有双关语）：

---

您不能将

这个
指针作为选择器的一部分传递。
我认为这是因为您绑定
这个
的方式，这是一个项目，据我所知，不能作为字符串绑定。你为什么不试试：

$(".fif").hover(function(){
        // in
        // fadeout image                
        $(this).find("img").fadeOut("fast");
        // fade in pmask
        $( this ).find(".pMask").fadeIn("fast");

  },function(){
    // out
        // fadeout pmask
        $(this).find(".pMask").fadeOut("fast");
        // fade in image         
        $(this).find("img")fadeIn("fast");     

});

我想这就是你想要的：

$('.pmask').hide();
$(".fif").hover(function(){
        // in
        // fadeout image                
        $(this).children("img").fadeOut("fast");
        // fade in pmask
        $(this).children(".pmask").fadeIn("fast");

  },function(){
    // out
        // fadeout pmask
        $(this).children(".pmask").fadeOut("fast");
        // fade in image         
        $(this).children("img").fadeIn("fast");     

});

对于
html
，我将您的
#pmask
id更改为
.pmask
类

<div class="fif">
  <img src="img/img1.jpg">
  <div class="pmask">
     some text or image 1
  </div>
</div>
<div class="fif">
  <img src="img/img2.jpg">
  <div class="pmask">
     some text or image 2
  </div>
</div>


一些文本或图像1
一些文字或图片2

这里有一个更新的JSFIDLE:
以及关于第一个孩子的内容。您需要重新访问
.pmask:first child
，因为
.pmask
不是div的第一个子项。另外，您的html中还有一个id与类相关的问题
$('.pmask').hide();
$(".fif").hover(function(){
        // in
        // fadeout image                
        $(this).children("img").fadeOut("fast");
        // fade in pmask
        $(this).children(".pmask").fadeIn("fast");

  },function(){
    // out
        // fadeout pmask
        $(this).children(".pmask").fadeOut("fast");
        // fade in image         
        $(this).children("img").fadeIn("fast");     

});

<div class="fif">
  <img src="img/img1.jpg">
  <div class="pmask">
     some text or image 1
  </div>
</div>
<div class="fif">
  <img src="img/img2.jpg">
  <div class="pmask">
     some text or image 2
  </div>
</div>