Floating menu: compatability issue

If you've problems with unsupported - non official ;-) - functionalities use this forum please.
Post Reply
User avatar
pSouper
Posts: 1552
Joined: Tue 11. Nov 2003, 15:45
Location: London
Contact:

Floating menu: compatability issue

Post by pSouper »

Hello Friends,

This i guess is the best forum for this thread...

I have found an OS script that floats 'STUFF' (in this case a {NAV_TABLE_COLUMN}) and although it works very well in IE it is showing a strange effect in NS & Firefox. would any of you guys'n'gals know how to solve this incomatability issue? (it may or may not be in the WCMS code)

a cut'n'paste into your LEFT area of a template will show you the effect.
or view it on my website http://www.jayenne.com with both IE & NS
ps: if anyone has other browsers I'd love to hear about compatability on those too :)

Code: Select all

{SPACER:160x20}//this pushes the main section away from the browsers left edge
<script>
if (!document.layers)
document.write('<div id="divStayTopLeft" style="position:absolute">')
</script>

<layer id="divStayTopLeft">

<!--EDIT BELOW CODE TO YOUR OWN MENU-->
{NAV_TABLE_COLUMN}
<!--END OF MENU 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="fromtop"

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

function JSFX_FloatTopDiv()
{
	var startX = 20,
	startY = 20;
	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;this.style.top=y;};
		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>
any help would be most.. well, helpfull :D
User avatar
DeXXus
Posts: 2168
Joined: Fri 28. Nov 2003, 06:20
Location: USA - Florida

Post by DeXXus »

I ~believe~ menus and some other scripts that use document.all or document.layers will not work "cross-browser", like you want.:
http://www.stopbadtherapy.com/standards.shtml
rookie
Posts: 109
Joined: Mon 31. May 2004, 22:01
Location: Hamburg, Germany

Post by rookie »

Heya pSouper

not sure what you are trying to accomplish with this script?

Are you looking to implement the javascript function for the nav?

If you are talking about pure CSS layouts, I have a phpWCMS test site that is purely CSS driven (with the NAV_TABLE_COLUMN floating on the left side) ...
My test CSS site also validates 100% with W3 and xhtml standards and is crossbrowser compatible (tested on mac OS, firefox mozilla, ie, netscape, opera).

Let me know if that's what you're looking for and I'll post the code.

If that isn't what you're looking for then someone else will probably have the advice you're seeking. :)
User avatar
pSouper
Posts: 1552
Joined: Tue 11. Nov 2003, 15:45
Location: London
Contact:

Post by pSouper »

hi guys,

ThanksDexxus for the link, i'm sure i'll go blind looking at such ugly pages, but as i need to know thier content so i'll will risk it :D

Thanks to you too rookie, the effet is.. when you scroll down the page the left habd menu follows down the page too. I'm not sure you ment that in your post but if you did then I'd love to see the code :D

..I will persevere...if anyone else has a good idea for this problem i'll love to hear from you too :)

*I am now sure the incompatibility is with {NAV_TABLE_COLUMN} as all other phpWCMS menus work correctly :D
I will now use NAV_LIST (or something)
rookie
Posts: 109
Joined: Mon 31. May 2004, 22:01
Location: Hamburg, Germany

Post by rookie »

Oh, so I think I am getting you now ...

You mean you'd like to have your NAV_TABLE_COLUMN to be of 100% height? So that it is as long as the content and floats with the content in terms of content length/height?

I am currently learning CSS and have tried out a few things. I can also try and make the left NAV TABLE COLUMN expand (for all browsers). If that's what you mean, I'll give it a go and post the code for you.
User avatar
pSouper
Posts: 1552
Joined: Tue 11. Nov 2003, 15:45
Location: London
Contact:

Post by pSouper »

hi Rookie: if you visit http://www.jayenne.com ( prefferabley with an IE browser :) ) you will see the 'floating' menu i reffer too (if you visit with Ns/moz/Ffox, you will notice the error i reffer to too :) )

thanks for your interest in this though Rookie (or maybe you are now Rookie++ :) )
User avatar
DeXXus
Posts: 2168
Joined: Fri 28. Nov 2003, 06:20
Location: USA - Florida

Post by DeXXus »

When I saved the page "locally", this made it work in Firefox 0.9.1 & IE 6.0.2800.1106:

WAS

Code: Select all

<div id="divStayTopLeft" style="position: absolute; left: 20px; top: 20px;">
NOW

Code: Select all

<div id="divStayTopLeft" style="width: 160; position: absolute; left: 0px; top: 0px;">
User avatar
pSouper
Posts: 1552
Joined: Tue 11. Nov 2003, 15:45
Location: London
Contact:

Post by pSouper »

perfect Dexxus: thank you so very much dude :D
If one could die from terminal happiness you should be preparing your deffence & retaining Johnny Cockran right about now :D
Post Reply