我用js改top 用了css3过渡属性过渡时间为一秒鼠标放上去div的top减少拿下来top增加

发布网友发布时间：2022-04-16 04:23

共2个回答

热心网友时间：2022-04-16 05:52

不知道你要实现什么效果。你的css属性和js代码并没有关系

我猜你要实现的效果用css是这样

#one div{
top:0;
position:absolute;
transition: all 1s ease;
}
#one div:hover{
top:30px;
transition: all 1s ease;
}

如果用js不要用mouseover和out,要用hover,可以这样写

(function() {
    var target = $('#one div'),
        targetPosition = parseInt(target.css('top')),
        lock;
    target.hover(function() {
        lock = setTimeout(function() { //一般写在timeout里面，加一点延迟，防止鼠标不小心滑过就触发
            target.animate({
                top: targetPosition + 30
            }, 1000, 'swing')
        }, 100)
    }, function() {
        clearTimeout(lock);
        target.animate({
            top: targetPosition
        }, 1000, 'swing')
    })
})()

热心网友时间：2022-04-16 07:10

建议试一试css的hover属性试一试，直接使用css比使用js好

我用js改top 用了css3过渡属性 过渡时间为一秒 鼠标放上去div的top减少 拿下来top增加

我用js改top 用了css3过渡属性过渡时间为一秒鼠标放上去div的top减少拿下来top增加