-1

我试图让一个按钮始终保持在页面顶部，即使有滚动也是如此。有人可以帮忙吗？

（这是一个简化的案例。我不能使用固定位置）

你可以在这里查看：http: //jsfiddle.net/TCX6h/6/

查询：

$(function(){
    var boto = $('.boto').offset().top;
    $(window).scroll(function() {
        if (boto < 0) {
            $( '.boto' ).offset({ top: 50 });
        } 
    });
})
4

4 回答 4

2

不需要jquery使用cssposition:fixed

演示小提琴

或者你可以这样做：

$(function(){
    $(window).scroll( function() {
        var boto =$(window).scrollTop() - $('.boto').offset().top;
        if (boto)
            $('.boto').addClass('top');
        else
            $('.boto').removeClass('top');
    } );
})

CSS：

.boto.top {
    position: fixed;
    top: 0;
}

演示小提琴

于 2013-09-22T09:27:14.103 回答
1

至于为什么你的（原始的，未经编辑的）代码不起作用，

  1. boto不指向$('#boto').offset().top，它只是存储它的价值。
  2. ==不是赋值，而是逻辑比较（所以boto == 0没有给出boto的值0，只是将其与/进行比较0并返回）。truefalse
  3. 这不是你.offset()用来设置位置的方式：http: //api.jquery.com/offset/
  4. .offset()相对于文档工作，而不是相对于视口

尝试：

$(function(){
    var boto = $('#boto');
    $(document).scroll(function() {
        boto.offset({top: document.body.scrollTop});
    });
});

http://jsfiddle.net/BYossarian/TCX6h/7/

于 2013-09-22T09:30:52.197 回答
0

是的@RAM 是对的。检查一下

#background {
position:fixed;
top:0;
    ...

小提琴

于 2013-09-22T09:28:24.857 回答
0

给你的按钮固定位置而不是绝对位置

    .boto{
    position:fixed;
    top: 0px; left:50%;
    margin-left:-115px;
    width:30px; height:20px;
    cursor:pointer;

    background:yellow;
    padding:30px 100px;
}

小提琴

于 2013-09-22T09:28:36.517 回答