Question

我目前有一个在鼠标输入时运行的功能。在'.tip-icon'mouseenter上我发生了css更改。但是有3个不同的'.tip-icon'。只有当您将鼠标悬停在每个属性上时，才会发生属性更改。如何自动为每个人设置此css更改，以便我不需要将鼠标悬停在每个人身上以进行修复？

每个'.tip-icon'都有不同的高度，这就是我使用$（this）的原因。所以最后3个不同的'.tip-icon'会有自己独特的css变化。

$('.tip-icon').mouseenter(function(){
    var toolHeight = $(this).siblings('.tip-group').children('.tip-message').height();
    $(this).css('top', (toolHeight/2)-6);

Answer 1

使用此：

$(function() {

    $('.tip-icon').css('top', function(){
        var toolHeight = $(this).siblings('.tip-group').children('.tip-message').height();
        return (toolHeight/2)-6;
    });

});

Answer 2

只需将.mouseenter更改为.each

$('.tip-icon').each(function(){
    var toolHeight = $(this).siblings('.tip-group').children('.tip-message').height();
    $(this).css('top', (toolHeight/2)-6);
});

如何使用$（this）自动为类运行函数？

2 个答案: