Div positioning

PoorDoggie · 07-29-2005, 10:53 AM

Hi. I am just learning about divs and DHTML and stuff, and was in the middle of making a menu system for a new site I am making, and I wondered if you could help me with something.

This menu is going to be dynamic. I want to be able to add and remove items on it with php and mysql, so I never know how far down a menu item is.

What I need is some javascript (or php) that will get the "right" value of a div and the "bottom" value of div (or the height and width).

This way I can calculate the next one down etc.

Thanks
Tom

harkster · 07-29-2005, 11:20 AM

This may or may not help but I have (I got the css somewhere & tweeked to my needs) a menu which I include via PHP.
Site = http://www.rosevillepottery.info this system well but needs some messing with to function in IE -- what else is new (yuck)!!

The include test is at http://www.rosevillepottery.info/menu-test.htm note the image moves up & down when menu contracts or expands.

NOTE the image in my example or whatever content follows the menu must be included in the div. If it follows it will be ptlaced by default relative to the div.

Hope helps get you going.

This is required for IE to work here.

Code:

<SCRIPT> startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("nav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function() {
this.className=this.className.replace(" over", "");
}
}
}
}
}
window.onload=startList;</SCRIPT>

PoorDoggie · 07-29-2005, 12:43 PM

thanks

but I was talking about a menu such as on http://www.dhtmlcentral.com/.

Thanks for the script though!

Still looking for help

Amnezia · 07-29-2005, 12:55 PM

the scripts used at dhtmlcentral are provided free on the site, why dont you get it from there?

PoorDoggie · 07-30-2005, 05:36 AM

because I want my menu to be dynamic. Theirs all the menu items are fixed!

While we are on the subject of positioning <div>s I was wondering if there is any way to position it relative to the bottom of the browser window? And is there any way to find out how wide the visitor's browser is? I have all these flashy things on my page with divs and I can never get it right on all browsers.

Another thing, which is really annoying with "alsolute" positioned divs is that it dosen't hold any weight in the layout of the site. I have these movable div's and the footer is connected to the header still:

HTML Code:

<table><tr><td>HEADER<\td><\tr><\table>
<div style="width:600px;height:800px;position:absolute;">Main Content</div>
<table><tr><td>FOOTER<\td><\tr><\table>

Is there any way to make the divs push the footer down?

07-29-2005, 10:53 AM	THREAD STARTER #1 (permalink)
PoorDoggie Soon to be RICHdoggie! Join Date: Jan 2005 Location: UK Posts: 2,408	Div positioning Hi. I am just learning about divs and DHTML and stuff, and was in the middle of making a menu system for a new site I am making, and I wondered if you could help me with something. This menu is going to be dynamic. I want to be able to add and remove items on it with php and mysql, so I never know how far down a menu item is. What I need is some javascript (or php) that will get the "right" value of a div and the "bottom" value of div (or the height and width). This way I can calculate the next one down etc. Thanks Tom

07-29-2005, 11:20 AM	#2 (permalink)
harkster Senior Member Join Date: Mar 2004 Location: Red State Posts: 1,605	This may or may not help but I have (I got the css somewhere & tweeked to my needs) a menu which I include via PHP. Site = http://www.rosevillepottery.info this system well but needs some messing with to function in IE -- what else is new (yuck)!! The include test is at http://www.rosevillepottery.info/menu-test.htm note the image moves up & down when menu contracts or expands. NOTE the image in my example or whatever content follows the menu must be included in the div. If it follows it will be ptlaced by default relative to the div. Hope helps get you going. This is required for IE to work here. Code: <SCRIPT> startList = function() { if (document.all&&document.getElementById) { navRoot = document.getElementById("nav"); for (i=0; i<navRoot.childNodes.length; i++) { node = navRoot.childNodes[i]; if (node.nodeName=="LI") { node.onmouseover=function() { this.className+=" over"; } node.onmouseout=function() { this.className=this.className.replace(" over", ""); } } } } } window.onload=startList;</SCRIPT> __________________ -- A Sometimes Light Hearted Journey Through The History of Shoes -- -- QUHL.com -- Last edited by hark; 07-29-2005 at 11:24 AM.

07-29-2005, 12:55 PM	#4 (permalink)
Amnezia Professional Monkey Join Date: Jul 2005 Location: Escaped from the zoo Posts: 907	the scripts used at dhtmlcentral are provided free on the site, why dont you get it from there? __________________ Webmaster Words

07-30-2005, 05:36 AM	THREAD STARTER #5 (permalink)
PoorDoggie Soon to be RICHdoggie! Join Date: Jan 2005 Location: UK Posts: 2,408	because I want my menu to be dynamic. Theirs all the menu items are fixed! While we are on the subject of positioning <div>s I was wondering if there is any way to position it relative to the bottom of the browser window? And is there any way to find out how wide the visitor's browser is? I have all these flashy things on my page with divs and I can never get it right on all browsers. Another thing, which is really annoying with "alsolute" positioned divs is that it dosen't hold any weight in the layout of the site. I have these movable div's and the footer is connected to the header still: HTML Code: <table><tr><td>HEADER<\td><\tr><\table> <div style="width:600px;height:800px;position:absolute;">Main Content</div> <table><tr><td>FOOTER<\td><\tr><\table> Is there any way to make the divs push the footer down?

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
How do I place my banner and links around this div layer?	BeckyTheStrange	Programming	4	07-12-2005 09:17 AM
DIV positioning	tsalexey544	Website Development	2	06-11-2005 05:16 PM
Problem with firefox display - div width	volos	Web Design Discussion	3	02-03-2005 09:10 AM
div positioning + css + IE problem?	countcobolt	Programming	0	12-22-2004 06:55 AM
div height problem	tot	Programming	2	05-12-2004 06:50 AM

07-29-2005, 12:43 PM	THREAD STARTER #3 (permalink)
PoorDoggie Soon to be RICHdoggie! Join Date: Jan 2005 Location: UK Posts: 2,408	thanks but I was talking about a menu such as on http://www.dhtmlcentral.com/. Thanks for the script though! Still looking for help

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)