[SOLVED] onmouseover

[asmith]

guys i am more than a noob in JAVA . till now i prevented coding with JAVA , but now i've faced something i must do with JAVA.

 

i want to show some links for example 3 links  when the mouse cursor goes on a picture. 

 

again  i want to know how can i open a square (not a new window, oh yea , like php freaks when your mouse goes on a function name)

 

and in that square i show the links or show a little html code and the user be able to click on those links  .

 

 

any simple code i could apply ?

 

thanks

[phpQuestioner]

this is javascript; not java - there two different languages.

 

<script language="javascript">

function showLinks()
{
document.getElementById('myLinks').style.display='block';
}

function hideLinks()
{
document.getElementById('myLinks').style.display='none'
}

</script>

<img src="" onmouseover="showLinks()" onmouseout="hideLinks()">

<div id="myLinks" style="display:none" onmouseover="showLinks()" onmouseout="hideLinks()">

<a href="http://www.google.com">Google</a>
<a href="http://www.yahoo.com">Yahoo</a>
<a href="http://www.msn.com">MSN</a>

</div>

[asmith]

thanks i understood it whole !

but some prolblems i've got with it . it is hard with it to move the mouse cursor to the new links . i have to click a few times on the image to make the links be fix on the screen , so i could navigate to them nd click on them .

 

1. how can i make it when the mouse go on the image , when the links appear i could easy goto the links ?

 

2. when te div part is displayed it mess up other elements in the page. you know what i mean  ? when the div is shown , it will be placed between other sites elements. i just want it shows up div "over" the html page. not "in" the html page . like phpfreaks on functions .

 

thanks a bunch

[rajivgonsalves]

this should solve your first point..

 

<script language="javascript">

function showLinks()
{
document.getElementById('myLinks').style.display='block';
}

function hideLinks()
{
document.getElementById('myLinks').style.display='none'
}

</script>

<div id="myLinks1" onmouseover="showLinks()">
<img src="" onmouseover="showLinks()" onmouseout="hideLinks()">
<div id="myLinks" style="display:none" onmouseover="showLinks()" onmouseout="hideLinks()">



<a href="http://www.google.com">Google</a>
<a href="http://www.yahoo.com">Yahoo</a>
<a href="http://www.msn.com">MSN</a>

</div>
</div>

[asmith]

thanks rajiv

 

but it still place div IN (between) other elements.  i don't want my page element move or something . i want it just show it like a new window ON the page .

 

 

(btw how are you doing ? long time no see )

[phpQuestioner]

 

1.) If you move your mouse vertically down from the image, to the div that has that contains the links; then you shouldn't have any problems - this is how a vertical menu works.

 

2.) You need to set the css style for the div; with a position of "absolute" and a z-index higher then all the other elements in your page (I usually set mine to 1000).

[asmith]

gotcha ! that'll work ! thanks