zoukankan      html  css  js  c++  java
  • jquery实现顶部浮动效果

    示例:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8" />
        <title>test page</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="css/main.css" />
        <script src="./jquery.js"></script>
    </head>
    <body>
    <div class="top"></div>
    <div class="wrap">
        <div class="tip">浮起来吧</div>
        <div class="xia">mmmmmmmmmmmmmmmmmmbbbbbbbbbbbbbbbbbbbbbbb</div>
        
            1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>
            1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>
            1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>
            1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>
    </div>
    <script type="text/javascript">
        $(function(){
            var stiptop = $(".tip").position().top;
            var sNum = 210;
            $(window).scroll(function(){
                var sTop = parseInt($(window).scrollTop());
                if(sTop > 210){
                     $(".tip").css({'position':'fixed','marginTop':'0px'});
                }
                else{
                    $(".tip").css({'position':'static','marginTop':'10px'});
                }
            });
        });
    </script>
    </body>
    </html>
  • 相关阅读:
    随记
    bzoj3551 [ONTAK2010]Peaks加强版
    bzoj2763 [JLOI2011]飞行路线
    bzoj1758 [Wc2010]重建计划
    bzoj1857 [Scoi2010]传送带
    bzoj4519 [Cqoi2016]不同的最小割
    bzoj2229 [Zjoi2011]最小割
    bzoj4129 Haruna’s Breakfast
    bzoj1835 [ZJOI2010] 基站选址
    bzoj2160 拉拉队排练
  • 原文地址:https://www.cnblogs.com/houweijian/p/3338998.html
Copyright © 2011-2022 走看看