Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New Coder
    Join Date
    Feb 2003
    Posts
    59
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How to Stop "Sliding Menu" from Scrolling?

    Here's the Complete Code: (Please check out for zipped attachment for original entire code)


    <head>
    <title>Slide-In Menu</title>
    <style type="text/css">
    body {background-image:url(back.gif);}
    #menu {position:absolute; top:-2000px; border:1px solid #000000; border-collapse:collapse; visibility:hidden;}
    td.txt {border:1px solid #000000; text-align:center; font-weight:bold; color:#ffffff;}
    td.txt a{font-family:tahoma,arial,helvetica,sans-serif; font-size:12px; font-weight:bold; color:#ffffff; text-decoration:none;}
    td.txt a:hover{font-family:tahoma,arial,helvetica,sans-serif; font-size:12px; font-weight:bold; color:#000000; text-decoration:none;}
    </style>
    <script type="text/javascript">
    var ie5= (document.getElementById && document.all);
    var ns6= (document.getElementById && !document.all);

    var MenuTop = 100; // menu top position
    var MenuLeft = 150; // how much your menu slide in and out

    var timerID1 = null;
    var timerID2 = null;

    function statik(){
    if(ie5){
    document.getElementById('menu').style.top = document.body.scrollTop + MenuTop;
    }
    if(ns6){
    document.getElementById('menu').style.top = window.pageYOffset + MenuTop;
    }
    }

    function changeBG(obj, bgColor) {
    if(ie5 || ns6){
    obj.style.backgroundColor = bgColor;
    }
    }

    function slideIn(){
    if(ie5 || ns6){
    if(parseInt(document.getElementById('menu').style.left) < 0){
    clearTimeout(timerID2);
    document.getElementById('menu').style.left = parseInt(document.getElementById('menu').style.left) + 5 + "px";
    timerID1=setTimeout("slideIn()", 30);
    }
    }
    }

    function slideOut(){
    if(ie5 || ns6){
    if(parseInt(document.getElementById('menu').style.left) > -MenuLeft){
    clearTimeout(timerID1);
    document.getElementById('menu').style.left = parseInt(document.getElementById('menu').style.left) - 5 + "px";
    timerID2=setTimeout("slideOut()", 30);
    }
    }
    }

    function reDo(){
    if(ie5 || ns6){
    window.location.reload();
    }
    }

    function slideMenuInit(){
    if(ie5 || ns6){
    document.getElementById('menu').style.visibility = "visible";
    document.getElementById('menu').style.left = -MenuLeft;
    document.getElementById('menu').style.top = MenuTop;
    }
    }


    window.onresize = reDo;
    setInterval ('statik()', 1);

    </script>
    </head>
    <body onload="slideMenuInit()">
    Last edited by serendipity; 09-26-2003 at 08:37 PM.
    Thanks in advance for any replies! :)

  • #2
    New Coder
    Join Date
    Feb 2003
    Posts
    59
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Fixed Position on the Sliding Menu

    It may seem quite a loooong script...but it actually shows a very clean and simple "view" on the webpage...

    Basically I just want the position of the menu to be fixed and "not follow" the scrolling...in fact, I don't want any scrollbars at all if that's at all possible...i've already tried css background: no-repeat and fixed and also overflow: hidden but that didnt work either...

    Any suggestions?
    Btw, this is a :bump: post
    I've attached the "original" zipped file of the code.
    Attached Files Attached Files
    Thanks in advance for any replies! :)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •