将鼠标悬停在链接上，图片显示循环

我目前正在为图库构建网站。我有一个简单的列表格式的展览桌，而我所追求的是当用户悬停在展览的标题上时，会出现预览图像，当您将鼠标悬停时，它会消失。将鼠标悬停在链接上，图片显示循环

我使用WordPress的，我有到位的所有核心结构：

我有我的表我有一个单一的图像显示，绝对和设置为显示无我加入了独特的课程后既展览的标题和形象

我似乎无法将它链接起来。

这是我的jQuery迄今与我想会的工作：

$('table#archive-table td a').hover(
    var className = $(this).attr('class'); 
    function() { 
     $('body.archive .first-show-image.'className).fadeIn('slow'); 
    }, 
    function() { 
     $('body.archive .first-show-image.'className).fadeOut('slow'); 
    } 
);

示例HTML：

<a class="33" href="#">Palomar</a> 
<div class="first-show-image 33"> 
    <div class="grid_2"> 
    <img src="test.png" /> 
    </div> 
</div> 
<a class="48" href="#">Palomar #2</a> 
<div class="first-show-image 48"> 
    <div class="grid_2"> 
    <img src="test.png" /> 
    </div> 
</div>

干杯， [R

来源

2013-05-13 John the Painter

这不是很清楚的问题是什么，你正在经历。 – 2013-05-13 16:23:59

是否输入了悬停代码错误的示例代码？我从来没有见过以这种方式定义的变量... – TNCodeMonkey 2013-05-13 16:25:28

对不起。例如，如果将鼠标悬停在类别为“33”的锚点上，则类别为“33”的div将淡入。如果移除悬停，它将淡出。等等...... – 2013-05-13 16:25:29

我不知道如何接近你示例代码与真实代码相匹配，但JavaScript中存在错误。试试这个

$('table#archive-table td a').hover(
    function() { 
     $('body.archive .first-show-image.' + $(this).attr('class')).fadeIn('slow'); 
    }, 
    function() { 
     $('body.archive .first-show-image.' + $(this).attr('class')).fadeOut('slow'); 
    } 
);

来源

2013-05-13 16:25:28 Klors

它看起来像你正在定义一个变量，其中jquery期待功能。试试这个：

$('table#archive-table td a').hover(
     function() { 
     var className = $(this).attr('class'); 
      $('body.archive .first-show-image.'className).fadeIn('slow'); 
     }, 
     function() { 
     var className = $(this).attr('class'); 
      $('body.archive .first-show-image.'className).fadeOut('slow'); 
     } 
    );

来源

2013-05-13 16:26:43 TNCodeMonkey

$('table#archive-table td a').hover(
    function() { 
     var className = $(this).attr('class'); 
     $('body.archive .first-show-image.' + className).fadeIn('slow'); 
    }, 
    function() { 
     var className = $(this).attr('class'); 
     $('body.archive .first-show-image.' + className).fadeOut('slow'); 
    } 
);

来源

2013-05-13 16:28:49

这就是工作。 @Klors和JEES的组合 - 谢谢你们。 – 2013-05-13 16:29:43

将鼠标悬停在链接上，图片显示循环

回答

相关问题