Question

＆＃13;

$(window).on('scroll load', function () {
    var hidePoint = 200;
    var stickPoint = 400;
    if ($(this).scrollTop() > stickPoint) {
        $('.sticky-header').addClass('stick');
    } else if ($(this).scrollTop() > hidePoint) {
        $('.sticky-header').removeClass('stick');
    }
});

＆＃13;

html {
    -webkit-font-smoothing: antialiased !important;
    font-smoothing: antialiased !important;
    text-rendering: optimizeLegibility !important;
    width: 100%;
    height: 100%;
    position: relative;
    overflow-x: hidden;
}
body {
    background-color: #FFF;
    color: #888;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.8 !important;
    height: 100%;
    position: relative;
}
.sticky-header {
    height: 100px;
    width: 500px;
    background-color:#ff8000;
    position: relative;
    text-align:center;
}
.sticky-header.stick {
    position: fixed;
}
.filler {
    height: 100px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<body style="transform:translateX(-100px);">
    <div class="sticky-header">Sticky Header</div>
    <div class="filler">Filler</div>
    <div class="filler">Filler</div>
    <div class="filler">Filler</div>
    <div class="filler">Filler</div>
    <div class="filler">Filler</div>
    <div class="filler">Filler</div>
    <div class="filler">Filler</div>
    <div class="filler">Filler</div>
    <div class="filler">Filler</div>
    <div class="filler">Filler</div>
    <div class="filler">Filler</div>
    <div class="filler">Filler</div>
    <div class="filler">Filler</div>
    <div class="filler">Filler</div>
</body>

＆＃13;

我试图在身体标签上使用transform:translateX(-400px)。

基本上这就是创建一个＆＃34; Push＆＃34;菜单，主体向左滑动，导航滑入空白区域。

当我使用transform:translate时，它会导致我使用.scrollTop（）的所有jQuery函数停止工作。

如果我使用firebug查看我的代码并从body标签中删除style="transform:translateX(-400px)"，则函数会重新开始工作。

我甚至试过创建一个＆＃34;身体包装＆＃34; div正好位于body标签下方，但仍然会导致同样的问题。

有什么想法吗？

为什么转换：影响我的jquery ScrollTop函数

0 个答案: