Question

我有多个产品图片，它们共享相同的“基础”类（.billede_wrapper1，.billede_wrapper2）和一个JQuery函数。

当.retslet5有鼠标悬停时，如何才显示.billede_wrapper.5？

以下是代码的当前状态，以及示例： jsfiddle

在示例中，两个产品都具有相同的类（.billede_wrapper，.retslet），它们将是（.billede_wrapper1，。retslet1，.billede_wrapper2， .retslet2）等等，在真实页面上。

表示产品数据库ID的数字。

Answer 1

使用$(this).find('.retslet')

查找子.retslet

$(document).ready(function(){
    $('.retslet').hide();

    $('.billede_wrap').mouseenter(function(){
        $(this).find('.retslet').slideDown("fast");
    });

    $('.billede_wrap').mouseleave(function(){
        $(this).find('.retslet').slideUp("fast");
    });
});

Answer 2

您可以使用hover：

$(document).ready(function(){
    $('.retslet').hide();

    $('.billede_wrap').hover(function(){
        $(this).find('.retslet').slideDown("fast");
    }, function() {
        $(this).find('.retslet').slideUp("fast");
    });

});

Answer 3

你应该在这个元素的子元素之间寻找div来滑动

$('.billede_wrap').mouseenter(function(){
    $(this).children('.retslet').slideDown("fast");
});

http://jsfiddle.net/6C6Mu/28/

单个功能的多个元素

3 个答案: