相关疑难解决方法(0)

如何获得固定位置div以与内容水平滚动?使用jQuery

我有一个div.scroll_fixed与以下CSS

.scroll_fixed {
    position:absolute
    top:210px

}
.scroll_fixed.fixed {
    position:fixed;
    top:0;
} 
Run Code Online (Sandbox Code Playgroud)

当div到达页面顶部时,我正在使用以下jQuery代码来设置.fixed类.

var top = $('.scroll_fixed').offset().top - parseFloat($('.scroll_fixed').css('margin-top').replace(/auto/, 0));

$(window).scroll(function (event) {
    // what the y position of the scroll is
    var y = $(this).scrollTop();

    // whether that's below the form
    if (y >= top) {
        // if so, ad the fixed class
        $('.scroll_fixed').addClass('fixed');
    } else {
        // otherwise remove it
        $('.scroll_fixed').removeClass('fixed');
    }
});
Run Code Online (Sandbox Code Playgroud)

这适用于垂直滚动固定.但是对于一个小的浏览器窗口,水平滚动会导致与此固定div右侧的内容发生冲突.

我希望div能够水平滚动内容.

任何人都可以指出我正确的方向.还在用JS/JQuery弄湿我的脚.

我基本上希望它像本例中的第二个框一样工作.

css jquery fixed

31
推荐指数
3
解决办法
7万
查看次数

标签 统计

css ×1

fixed ×1

jquery ×1