...

View Full Version : How to Stop "Sliding Menu" from Scrolling?



serendipity
09-26-2003, 06:38 PM
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()">

serendipity
09-26-2003, 09:53 PM
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.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum