...

View Full Version : how to do something like that?



justyna
09-02-2007, 06:39 PM
Hi!
There is a nice feature that I've seen on data recovery services (http://www.salvagedata.com) site.
When you move mouse over the "Country", in the top on the right side of the page, then the frame pop ups,
with he list of country to choose. I want o do sth like that on my page, but I've just started to learn javascript,
and I have no idea how to do it...can enybody help me out?
Here is a link to that site where I've seen these feature: www.salvagedata.com (http://www.salvagedata.com)
Thank for your help.

vwphillips
09-02-2007, 11:47 PM
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
<title></title>
<style type="text/css">
/*<![CDATA[*/
.topicbg {
position:relative;z-Index:101;width:100px;height:25px;background-Color:#FFFFFF;
}

.topic {
position:relative;z-Index:1;width:100px;height:20px;background-Color:#FFFFCC;border:solid black 1px;
}

.tooltip {
position:absolute;visibility:hidden;left:0px;top:22px;width:200px;height:200px;background-Color:#FFFFCC;border:solid black 1px;
}
/*]]>*/
</style>
<script language="JavaScript" type="text/javascript">
/*<![CDATA[*/

function zxcToolTip(zxcevt,zxcobj){
var zxctt=zxcobj.getElementsByTagName('DIV')[0];
if (zxcevt.type=='mouseover') zxctt.style.visibility='visible';
else if (zxcCkEventObj(zxcevt,zxcobj)) zxctt.style.visibility='hidden';

}

function zxcCkEventObj(zxce,zxcobj){
if (!zxce) var zxce=window.event;
zxce.cancelBubble=true;
if (zxce.stopPropagation) zxce.stopPropagation();
var zxceobj=(zxce.relatedTarget)?zxce.relatedTarget:(zxce.type=='mouseout')?zxce.toElement:zxce.fromElem ent;
while (zxceobj.parentNode){
if (zxceobj.className&&zxceobj.className.match('zxc')){ return false; }
zxceobj=zxceobj.parentNode;
}
return true;
}

/*]]>*/
</script></head>

<body>
<div class="topicbg zxctt" >
<div class="topic zxctt"
onmouseover="zxcToolTip(event,this);"
onmouseout="zxcToolTip(event,this);"
>
<div class="tooltip" >
<a href="http://www.vicsjavascripts.org.uk" >Link</a>
</div>
Country
</div>
</div>

</body>

</html>

or google Tool Tip



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum