body onload

**Nile** · 09-01-2008, 05:10 AM

@Chechu, correction to codeexploiter's code

Code:

window.onload = function(){
	document.getElementById('loading').style.display = 'none';
	document.getElementById('content').style.display = 'inline'";
	
	initListGroup('chainedmenu', document.listmenu0.firstlevel, document.listmenu0.secondlevel, document.listmenu0.thirdlevel, document.listmenu0.fourthlevel, 'saveit')
}

Remove the highlighted.

**chechu** · 09-01-2008, 06:29 AM

You can find the script here. Thanks for your efforts, but none of the proposed scripts work. Is that because the chained menu script is referring to two .js files ?

**Nile** · 09-01-2008, 06:38 AM

Can you explain what:

Code:

initListGroup('chainedmenu', document.listmenu0.firstlevel, document.listmenu0.secondlevel, document.listmenu0.thirdlevel, document.listmenu0.fourthlevel, 'saveit')

Does?

**chechu** · 09-01-2008, 06:43 AM

http://www.dynamicdrive.com/dynamici...menu/index.htm
That's where the script comes from. The onload has to with: if the first selction is made, then you can go to the next, and the next...

**chechu** · 09-01-2008, 05:20 PM

Anyone please ?

**molendijk** · 09-01-2008, 07:34 PM

Chechu, see this.
===
Arie.

**chechu** · 09-01-2008, 08:33 PM

Thanks, Arie, but I do not find the answer in the comments.

**chechu** · 09-02-2008, 08:21 AM

really need help here

**codeexploiter** · 09-02-2008, 09:37 AM

1. Use the attached config.js file in your page(take a backup of the original one):

2. In your HTML page where the chained select list comes, remove the inline 'onload' attribute from the body element and insert the following into any of your script block:

Code:

window.onload = function(){
	if(document.getElementById('loading') && document.getElementById('content')){
		document.getElementById('loading').style.display = 'none';
		document.getElementById('content').style.display = 'inline';
	}
	aaddListGroupOnDomReady(); //This calls the function available in the config.js
	initListGroup('chainedmenu', document.listmenu0.firstlevel, document.listmenu0.secondlevel, document.listmenu0.thirdlevel, document.listmenu0.fourthlevel, 'saveit');
}

Make sure that the elements with ids 'loading' and 'content' available in your page otherwise the first part of the above mentioned event handler will be proceed further.

3. Modify the CSS (the highlighted lines)

Code:

#loading{
position: absolute; 
position: middle; //There is no such property value in CSS Remove this line
margin-left: auto;
margin-right: auto;
padding-left: auto;
padding-right: auto;
color: grey; 
background: #ffffff; 
font-family: tahoma;
font-size: 11px;
color: 456a96; //You need to put a # before the color number.
}

The above CSS rule contains two 'color' properties one I've highlighted and there is one more with a value of 'grey' remove one and use a meaningful value.

Hopefully if you do these changes the things will work as you want.

**chechu** · 09-02-2008, 10:03 AM

I downloaded the config.js, and adapted the following:

Code:

<head>
<style type="text/css">
#loading{
position: absolute; 
margin-left: auto;
margin-right: auto;
padding-left: auto;
padding-right: auto;
background: #ffffff; 
font-family: tahoma;
font-size: 11px;
color: #456a96;
}
</style>

<script type="text/javascript">
window.onload = function(){
	if(document.getElementById('loading') && document.getElementById('content')){
		document.getElementById('loading').style.display = 'none';
		document.getElementById('content').style.display = 'inline';
	}
	aaddListGroupOnDomReady(); //This calls the function available in the config.js
	initListGroup('chainedmenu', document.listmenu0.firstlevel, document.listmenu0.secondlevel, document.listmenu0.thirdlevel, document.listmenu0.fourthlevel, 'saveit');
}
</script>
</head>
<center>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div id="loading">
<center>
<img src="images/header.jpg" style="border: 0px; text-align:center; margin-top:1px;">
<p align=center><b>title</b>
<p align=center>subtitle
<p align=center><br>&nbsp;<br><img src="images/loader.gif" style="border: 0px;">
</center>
</div>
<div id='content' style='display:none;'>

The onload image and text appear, but at the very right of the screen (I need to scroll to see it), and the select functions are disabled.

Thread: body onload

Thread Tools

Search Thread

The Following User Says Thank You to codeexploiter For This Useful Post:

Bookmarks

Bookmarks

Posting Permissions