javascript - 使用 jQuery 覆盖内联 CSS 应用了一段时间，然后就消失了。为什么？

Question

我正在尝试更改 top 的内联 CSS 样式，该样式默认由 jQuery 使用 jQuery CSS() 类提供。但它应用了一段时间，然后再次切换到旧的内联 CSS 顶部样式。

为什么会这样？

参见 jsfiddle .

这是我所做的:

<script>
`$(".popbutton").on('click',function(e) {
    var mousex = e.pageX + 20, //Get X coodrinates
    mousey = e.screenY + 20; //Get Y coordinates
    var e = jQuery(this);
    this.timer=setTimeout(function () {
        e.popover("show");     
    },600);
    var menu = $(".popbutton").next(),
    menuWidth = menu.width(), //Find width of tooltip
    menuHeight = menu.height(), //Find height of tooltip
    menuVisY = $(window).height() - mousey, //Distance of element from the bottom of viewport
    heightY=$(this)[0].scrollHeight-(1.2*menuHeight);
    $(menu).css('top','100px');
    });
});`

</script>

Answer 1

因为这段代码:

this.timer = setTimeout(function () {
        e.popover("show");
    }, 600);

当您点击按钮时，位置计算正确，但 e.popover('show') 在延迟 600 毫秒后再次更改位置。