modifying a <div> tag with JavaScript

I have created a division within a HTML file, using the &lt;div&gt; tag, with the id mnu. I want the HTML code within this division to change when the mouse cursor is placed over the division. Therefore I have added the onmouseover event listener to the division, which calls a JavaScript function called shwMnu when this event is detected. The code that I have used for the function is shown below:

function shwMnu()
{
var mnu="&lt;table&gt;&lt;tr&gt;&lt;td&gt;&lt;img src='webPageFiles/btn2.gif'&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;";
mnu.innerHTML=mnu;
}

The problem is that when the HTML code is changed, instead of the image that I want to appear (i.e. webPageFiles/btn2.gif) I get the box with the red x in it, therefore it would appear that my browser cannot locate the image. I have found that if I place the HTML file in the same directory as the image, so that I can remove the 'webPageFiles\' folder path from the image src attribute then the web-page works as I would like.

You should also note that the JavaScript file is located in the same directory as the image, i.e. one level below the HTML file. Although I don't think this makes any difference.

THANX in advance,

TTAYO

make it img src='http://www.webPageFiles/btn2.gif or what ever the full address is, sometimes such things mess the whole work up.

Thanx for your reply Black Cluster, but I have already tried using the full file path instead of the relative file path and that also didn't work.

L8R,

TTAYO

first point why are you using tables for none tabular data? grrrr!

anyways properly consturcted img tag looks like so...

Code:

---

<img src="./webPageFiles/btn2.gif" alt="Text about the Image" />

---

as the img tag has no end tag you need to close it, and for full standards compliance make sure you always use your alt tags! But please remember alt tags are suppoused to be an alternative to the image (ie when it wont load). If you want to add in a tooltip use the title attribute.

If that img tag doesn't work please reply with...

your dir layout as like so,
root/page.html
root/webPageFiles/image.gif

so can be sure have gotten the location of each file in relation to each other and the document root correct

as well as the location which the browser is looking for the image (rightclick on the red X and choose properties - what is the URL the browser is reporting?)

ta

v_Ln

thanx for that valhallen, it worked out great.

although in solving that problem I have found another, I have been editing the html that is contained within a &lt;div&gt; tag, with the use of JavaScript. Which works fine until I try to include an anchor hyperlink with the JavaScript, then the browser recognises the hyperlink, but the link will not forward the browser to the desired location. When one clicks on the link the browser remains on the current page.

So I have no idea what is causing the problem, because if their was a problem with the desination then I would expect the browser to give me a 'page cannot be displayed' error.

Thanx in advance,

TTAYO

you could always include the location within your javascript function the link is calling

Code:

---

window.location="http://www.page-to-show.com/";

---