首页 新闻 会员 周边 捐助

求一段Jquery判断浏览器高度的代码,用于改变position:fixed

0
悬赏园豆:30 [已解决问题] 解决于 2014-05-19 08:55

就是页面上的工具栏,当浏览器向下拉时固定位置,改变Div的position:fixed,当向上拉到顶时改变Div的position:relative,谁有用着的代码给我一份,谢谢啦!

happydaily的主页 happydaily | 菜鸟二级 | 园豆:260
提问于:2014-05-18 17:35
< >
分享
最佳答案
0

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="content-type" content="text/html;charset=utf-8" />
        <script type="text/javascript" src="jquery-1.8.3.min.js"></script>
    </head>
    <style>
        *{margin:0;padding:0;}
        
        #menuw{width:1000px;margin:0px auto;height:50px;}
        #menu{width:1000px;height:50px;background-color:#fcf;}
    </style>
    <body>
        <div style="width:1000px;margin:0px auto;">
            顶部<br/>顶部<br/>顶部<br/>顶部<br/>顶部<br/>顶部<br/>顶部<br/>顶部<br/>
        </div>
        <div id="menuw">
            <div id="menu"></div>
        </div>
        <div style="width:1000px;margin:0px auto;height:1000px;">
            内容<br/>内容<br/>内容<br/>内容<br/>内容<br/>内容<br/>内容<br/>内容<br/>
        </div>
    </body>
    <script>
        $(function(){
            $("#menu").data({offset:$("#menu").offset()});
            $(window).bind("scroll",function(){
                var menu=$("#menu");
                var dtop=$(document).scrollTop();
                var offset=menu.data("offset");
                if(dtop>offset.top){
                    if($.browser.msie&&parseInt($.browser.version)<7){//IE6
                        menu.css({position:"absolute",top:dtop});
                    }else{
                        menu.css({position:"fixed",top:0});
                    }
                }else{
                    menu.css({left:"",top:"",position:""});
                }
            });
        });
    </script>
</html>

收获园豆:30
程序未来 | 菜鸟二级 |园豆:232 | 2014-05-18 18:53
其他回答(1)
0

使用css也可以吧,就不用jquery了

<div id="head"></div> position:fixed;height:100px;

<div id="content"></div> margin-top:100px;

ThreeTree | 园豆:1490 (小虾三级) | 2014-05-18 19:01
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册