简体   繁体   中英

Fixed div on scroll down & Set absolute when scroll up

sir I want to lock my menu with div id menu fixed in top of window when scroll down the window, and also I want to set position as absolute when it scroll up I tried with this code. its doing the first job correctly. i can set the menu fixed at top of page. but it can't set the page absolute position when scroll up here is my code

  <script type="application/javascript">
    $(window).bind('scroll', function () {
        if (window.scrollY=100){
            document.getElementById("menu").style.position = "fixed";
            document.getElementById("menu").style.top = "0px";
            }
        else if(window.scrollY < 100){
            document.getElementById("menu").style.position = "absolute";
            document.getElementById("menu").style.top = "100px";
            }
    });

    </script>

You were assigning value instead of comparing window.scrollY=100 The code should be:

$(window).bind('scroll', function () {
    if (window.scrollY>=100){
        //            ^^-----------use >= here
        document.getElementById("menu").style.position = "fixed";
        document.getElementById("menu").style.top = "0px";
        }
    else if(window.scrollY < 100){
        document.getElementById("menu").style.position = "absolute";
        document.getElementById("menu").style.top = "100px";
        }
});

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM