onmouseover()
Posted: Mon Aug 13, 2007 1:16 am
How to hide the orange tooltip. It should be displayed only when mouse over the text in li
Code: Select all
<style type="text/css">
.roundcont {
width: 250px;
background-color: #f90;
color: #fff;
}
.roundcont p {
margin: 0 10px;
}
.roundtop {
background: url(tr.gif) no-repeat top right;
}
.roundbottom {
background: url(br.gif) no-repeat top right;
}
img.corner {
width: 15px;
height: 15px;
border: none;
display: block !important;
}
</style>
Code: Select all
<script>
function showdiv(){
var tip;
tip = document.getElementById("one");
tip.style.display ="block";
}
function hidediv(){
var tip;
tip = document.getElementById("one");
tip.style.display ="none";
}
</script>
Code: Select all
<div id="one">
<li onMouseOver="javascript:showdiv(); onMouseOut="hidediv();>--Somename
<div class="roundcont">
<div class="roundtop">
<img src="tl.gif" width="15" height="15" class="corner" style="display: none" />
</div>
<p> On mouse over</p>
<div class="roundbottom">
<img src="bl.gif" width="15" height="15" class="corner" style="display: none" />
</div>
</div>
</li>
</div>
</div>