获取 alt 标签以在悬停时显示在图像上

Question

所以我已经在 jsfiddle 上完美地工作了：

$('img', '.thumb').each(function() {
  $(this).parent().append('<div class="thumbnail-text">' + this.alt + '</div>');
}).bind({
  mouseenter: function() {
    $(this).siblings('.thumbnail-text').show();
  },
  mouseleave: function() {
    $(this).siblings('.thumbnail-text').hide(); 
  }
});

但我一辈子都想不出如何让它与 wordpress 画廊插件一起工作：

http://www.adammichaelogden.com/my_work/

我已经尝试了所有我能想到的方法，但我只知道它可能非常简单，我忽略了它。有帮助吗？

Answer 1

看起来你有几个语法错误。您缺少 img 和 .all-images 选择器之间的逗号，并且缺少结尾的 });.

尝试将块更改为此

$(function() {
  $('img','.all-images').each(function() {
    $(this).parent().append('<div class="thumbnail-text">' + this.alt + '</div>');
  }).bind({
    mouseenter: function() {
      $(this).siblings('.thumbnail-text').show();
    },
    mouseleave: function() {
      $(this).siblings('.thumbnail-text').hide();
    }
  });
});

Answer 2

其实$好像不接受。我在您网站的控制台中有运行下面的代码并且它有效：-

jQuery('img','.all-images').each(function() { 
    jQuery(this).parent().append('<div class="thumbnail-text">' + this.alt + '</div>'); 
}).bind({ mouseenter: function() { 
    jQuery(this).siblings('.thumbnail-text').show(); 
}, mouseleave: function() { 
    jQuery(this).siblings('.thumbnail-text').hide(); } 
});

获取 alt 标签以在悬停时显示在图像上

Getting an alt tag to show up over an img on hover

css

wordpress

jquery

alt