0

我目前正在为画廊建立一个网站。我有一个简单列表格式的展览表,我所追求的是当用户将鼠标悬停在展览标题上时,会出现预览图像,而当您将鼠标悬停时它会消失。

我正在使用 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

4

3 回答 3

2

我不知道您的示例代码与真实代码的匹配程度如何,但 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-13T16:25:28.530 回答
1
$('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-13T16:28:49.763 回答
0

看起来您正在定义一个 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-13T16:26:43.373 回答