如何让边栏向上移动 [英] How do I get the sidebar to move up

查看:220
本文介绍了如何让边栏向上移动的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有这个页面,我想让侧边栏与用户一起滑动,并且它的工作原理好吧,但如果你是在一个小屏幕像1024 * 768你不会看到底部。这里是一些我用来使侧边栏工作的代码。任何建议,如何我可以改变这种行为。

I have this page and I want the sidebar to slide down with the user and it works well but if you are on a small screen like 1024 * 768 you will not see the bottom. Here is some of the code I used to make the sidebar work. Any suggestions on how I can change this behavior.

$(window).scroll(function(){ 
    sidebar_position();
});
$(window).resize(function(){ 
    sidebar_position();
});


function sidebar_position(){
    var w_width = ($(window).width() -1000) /2;
    $('#sidebar').css('left', w_width);

    var sidebar_height = $('#sidebar').outerHeight();
    var content_height = $('#widecolumn').outerHeight();
    var w_height = $(window).height();

    if ( sidebar_height > w_height) {
        $('#sidebar').css('position', 'absolute');
    } else {
        $('#sidebar').css('position', 'fixed');
    };

    if (sidebar_height > content_height) {
        content_height = sidebar_height;
        $('#widecolumn').css('min-height', content_height);
    };


    if($.browser.msie && $.browser.version == 6 ){
        $(window).scroll(function(){ 
            $('#sidebar').css({
                top: $(window).scrollTop()
            });
        })
    }
}

我有点失去下一步做什么....和如何解决这


I am sort of lost of what to do next....and how to fix this

推荐答案

小屏幕是一个问题,因为侧边栏几乎是600像素高,所以上网本,它可能不适合浏览器窗口。

Hm small screens are a problem either way since the sidebar is almost 600 px high so on netbooks it probably won't fit in the browser window at all.

但您可以将侧边栏保持在绝对位置,直到侧边栏滚动到顶部,然后切换到位置固定,因此它保持在屏幕顶部。 >
这样它将使用可用的屏幕高度

But you could leave the sidebar on position absolute until the sidebar reaches the top when scrolling and then switch to position fixed so it stays at the top of the screen.
That way it will use the available screen height

这篇关于如何让边栏向上移动的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆