模拟位置:固定在jQuery中

前端之家收集整理的这篇文章主要介绍了模拟位置:固定在jQuery中前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个大于页面宽度的标题,因此我无法使用position:fixed将其设置在页面的顶部,因为我绝对需要能够水平滚动.我不认为这是一个CSS解决方案.

我做了一个代码示例来尝试重现position的效果:fixed,但是有不希望的跳转.我的代码如下:

$(window).scroll(function() {
            var y = $(window).scrollTop();
            $("#headertable").css('top',y+175);
});

有没有办法使它真正附加,如位置:固定? (奇怪的是,现在在IE中比在FF中更好地显示,因为它没有这种“跳”效果)

请在这里找到一个例子:http://jsbin.com/eyuya/7.第一个表是位置:固定,另一个使用我的代码.这是跳出来的效果,我试图避免,如果有一个解决方案.

编辑:

仍然没有找到一个令人满意的解决方案,我想我会使用这个最终,因为该网站是要用于IE,它似乎并不像一个奇迹解决方案存在附加一个div到视口,并且能够水平滚动.如果有人遇到这个问题,我就开始一个赏金,找到了一个很好的解决方案.

感谢已经尝试回答这个问题的人不像看起来那么简单;)

解决方法

您可以使用静态定位的DIV包装元素以获取滚动条,然后根据scrollLeft值监听窗口滚动并定位固定标题
var elem = $('#headertable');
var win  = $(window);
var wrap = $('<div>').css({
    width: elem.width(),height: elem.height()
});
elem.wrap(wrap);
win.scroll(function() {
    elem.css('left',win.scrollLeft()*-1);
});

似乎在IE / FF / Chrome中工作:

http://jsbin.com/efuya3

原文链接:https://www.f2er.com/jquery/179324.html

猜你在找的jQuery相关文章