...

View Full Version : Hover/Click Info Box



NEONecd999
01-17-2004, 09:33 PM
I want to get a hold of a code that when you hover over text, a box comes up (like in help files-- when you click on a link sometimes, a yellow box comes up with black text in it) giving a little info on the topic.

Does anyone know where I could get a hold of such a code?

Thanks.

coothead
01-18-2004, 01:15 AM
Hi there NEONecd999,

Welcome to these forums.
Do you want something like this....


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<meta content="mshtml 6.00.2800.1264" name="generator" />
<title>little yellow box</title>
<style type="text/css">
/*<![CDATA[*/
span
{
font-family:arial;
font-size:16px;
color:#ff0000;
cursor&#58;pointer;
}
div
{
width:81px;
height:50px;
border:solid 1px #000000;
position:absolute;
left:90px;
top:45px;
background-color:#ffff00;
font-family:arial;
font-size:11px;
color:#000000;
padding:5px;
visibility:hidden;
}
/*]]>*/
</style>
</head>
<body>
<p>Do you need &#160;
<span onmouseover="getElementById('foo').style.visibility='visible'"
onmouseout="getElementById('foo').style.visibility='hidden'">
information
</span>
</p>
<div id="foo">This is the Information that you requested</div>
</body>
</html>


c:cool::cool:thead

Vladdy
01-18-2004, 01:19 AM
use title attribute.
if you need more functionality, or more presentation option see my tooltips code (http://www.klproductions.com/kltooltips.html)



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum