Question

我有一些img图标链接到各种外部网站（电子邮件，脸书，推特等）onclick，我试图让他们在悬停时在另一个div显示一些隐藏文字。

this thread中的第二个小提琴链接完成类似于我想用CSS做的事情，但我正在尝试使用jQuery slideToggle()设置show / hide动画，我已经实现了在页面的其他部分，所以css不会这样做。

This thread似乎它有我正在寻找的东西，但我已经用它作为模板，到目前为止没有任何工作，我很难过。这是我的代码，任何建议将不胜感激：

    $('div.tooltip').hide();
$('img.tooltip').hover(function() {

    which = $(this).attr("class");
    selector = 'div.' + which;
    slide = $(selector).slideToggle();
    console.log(slide);
});

P.S。 - 我想也许问题是当我拨打slideToggle()时它没有撤消第1行的hide()调用，但是当我注释掉那个调用并改为像字体颜色这样简单的东西时，仍然没有骰子。

编辑：为了澄清，img及其相应的div共享相同的类名（例如img.tooltip email应该触发div.tooltip email等），这就是我使用的原因“哪个”和“选择者”。

Answer 1

您的问题很可能是行which = $(this).attr("class");，它将返回该元素具有的所有类的空格分隔列表。由于图片至少有.tooltip，这意味着selector看起来像div.tooltip someotherclass，它会查找someotherclass类型的元素，它是带有类工具提示的div的后代。由于很可能没有someotherclass的元素类型，因此不返回任何内容。

编辑：

如果您只使用两个类，例如问题中的案例，则可以将代码更改为

$('img.tooltip').hover(function() {
    which = $(this).attr("class").replace('tooltip', '').replace(' ','');
    selector = 'div.' + which;
    slide = $(selector).slideToggle();
    console.log(slide);
});

将从制作tooltip的类字符串中删除which = 'email'类，而不是which = 'tooltip email'

Answer 2

确实

slide = $('div.tooltip').slideToggle();

不行吗？我很困惑为什么你需要这个功能的前两行。

当悬停在另一个div上时，jquery调整div

2 个答案: