floating menu goes too far down

**gib65** · 06-14-2008, 12:21 AM

1) Script Title:

Floating Menu script

2) Script URL (on DD):

http://www.shahspace.com/mm-theory/home.htm

3) Describe problem:

Hello,

I'm trying to program a Floating Menu script into my website here. I did it exactly as the instructions say: I copied and pasted the whole code provided and just before my </body> tag. It seems to work in that it keeps the menu at the bottom of my page but it's literally at the bottom of the page - i.e. it's WAY below the bottom of the screen and you have to scroll WAY down to see it. How can I program it to hover at the bottom of the screen rather than the entire page? Or better yet, how do I get it to hover near the middle or near the top? How can I set the precise location?

Thanks for the forthcoming help.

**rangana** · 06-14-2008, 12:42 AM

See if removing the DTD helps.

**rangana** · 06-14-2008, 12:49 AM

Floating menu script never works when there is a DTD.
Hopefully, this new edition should work with DTD:

Code:

<script>
if (!document.layers)
document.write('<div id="divStayTopLeft" style="position:absolute">')
</script>

<layer id="divStayTopLeft">

<!--EDIT BELOW CODE TO YOUR OWN MENU-->
<table border="1px" width="130px" cellspacing="0" cellpadding="0">
  <tr>
    <td width="100%" bgcolor="#FFFFCC">
      <p align="center"><b><font size="4px">Menu</font></b></td>
  </tr>
  <tr>
    <td width="100%" bgcolor="#FFFFFF">
      <p align="left"> <a href="http://www.dynamicdrive.com">Dynamic Drive</a><br>
       <a href="http://www.dynamicdrive.com/new.htm">What's New</a><br>
       <a href="http://www.dynamicdrive.com/hot.htm">What's Hot</a><br>
       <a href="http://www.dynamicdrive.com/faqs.htm">FAQs</a><br>
       <a href="http://www.dynamicdrive.com/morezone/">More Zone</a></td>
  </tr>
</table>
<!--END OF EDIT-->

</layer>


<script type="text/javascript">

/*
Floating Menu script-  Roy Whittle (http://www.javascript-fx.com/)
Script featured on/available at http://www.dynamicdrive.com/
This notice must stay intact for use
*/

//Enter "frombottom" or "fromtop"
var verticalpos="frombottom"

if (!document.layers)
document.write('</div>')

function JSFX_FloatTopDiv()
{
	var startX = 3,
	startY = 200;
	var ns = (navigator.appName.indexOf("Netscape") != -1);
	var d = document;
	function ml(id)
	{
		var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
		if(d.layers)el.style=el;
		el.sP=function(x,y){this.style.left=x+'px';this.style.top=y+'px';};
		el.x = startX;
		if (verticalpos=="fromtop")
		el.y = startY;
		else{
		el.y = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
		el.y -= startY;
		}
		return el;
	}
	window.stayTopLeft=function()
	{
		if (verticalpos=="fromtop"){
		var pY = ns ? pageYOffset : document.body.scrollTop;
		ftlObj.y += (pY + startY - ftlObj.y)/8;
		}
		else{
		var pY = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
		ftlObj.y += (pY - startY - ftlObj.y)/8;
		}
		ftlObj.sP(ftlObj.x, ftlObj.y);
		setTimeout("stayTopLeft()", 10);
	}
	ftlObj = ml("divStayTopLeft");
	stayTopLeft();
}
JSFX_FloatTopDiv();
</script>

Hope it helps.

**gib65** · 06-14-2008, 02:17 AM

You're right! Commenting out the DTD solved the problem... but it created a different problem. Now my webpage is all messed up. The main content has completely disappeared.

My DTD looks like this:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

Is there something I can replace it with that'll work with my floating menu?

**rangana** · 06-14-2008, 02:30 AM

Have you had tried to play with the script I posted in post#3? It should work with DTD.

**gib65** · 06-14-2008, 04:02 AM

I sure did. I tried it with my DTD and without it. It only works without it.

**rangana** · 06-14-2008, 04:07 AM

You're not updating your page. And, if you will, I could'nt get in since its blocked (just now) in my workplace.

Have you tried adding the highlighted into the script:

Code:

el.sP=function(x,y){this.style.left=x+'px';this.style.top=y+'px';};

**gib65** · 06-14-2008, 04:27 AM

Originally Posted by rangana

You're not updating your page. And, if you will, I could'nt get in since its blocked (just now) in my workplace.

No I haven't updated the code on the server. I have no access to it right now. I'm updating it on my laptop. I probably won't be able to update the server until after the weekend unless I make a stop at the office sooner.

Originally Posted by rangana

Have you tried adding the highlighted into the script:

Code:

el.sP=function(x,y){this.style.left=x+'px';this.style.top=y+'px';};

Yes, that line is already there - even the highlighted parts.

I appreciate the help. Any other suggestions (like a substitute for the DTD)?

**gib65** · 06-16-2008, 07:30 PM

I've updated the website.

Thread: floating menu goes too far down

Thread Tools

Search Thread

floating menu goes too far down

Bookmarks

Bookmarks

Posting Permissions