HI there, I wonder if you can help me. I am doing a bit of javascript/jquery testing here and there and I have come up with the following http://antobbo.webspace.virginmedia.com/test/test.htm. Now first thing, you will notice when you land on the page that for less than a second you will see a big yellow div appearing and disappearing. This is the first issue. I have a div more_info that I hide away through jquery:

HTML Code:
<div id = "more_info" class = "more_info">

						<p>info on Item 1</p>
						<p>info on Item 2</p>
						<p>info on Item 3</p>
						<p>info on Item 4</p>
						<p>info on Item 5</p>
						<p>info on Item 6</p>
						<p>info on Item 7</p>
						<p>info on Item 8</p>
						<p>info on Item 9</p>
		border:1px solid red;
and the script:
function no_script(){
var info_div = document.getElementById('more_info');
info_div.style.display = "none";

$("#navigation li a").hover(
	}, function(){

The function in the external script is called from the body tag in the html. Is this the reason why the div appears briefly when the page loads? How do I get around this and make sure that the div is hid straight away without flashing on my screen for a sec?

Second issue: when I get the first one fixed, what I would like to do is to ideally hover on the first item in the right-hand side list (under "select a design") and get the yellow div up with just the corresponding paragraph: so first list item gets "info on Item 1", second list item gets "info on Item 2" etc... Now, what's the best way to achieve this? I presume I need to first hide all the paragraphs, then send them as parameters to the function and then show them again. So assuming each paragraph has a para id so that paragraph 1 is para1 etch would the following be correct
HTML Code:
<div id = "navigation">
			<li><a href = "#" onHover = "no_script("para1")">gdkjgkdf</a></li>
			<li><a href = "#" onHover = "no_script("para2")">flkjgsldfgs</a></li>
I am just trying to get a feeling for the best way to build or modify the attached script