All pastes #93499 Raw Edit

Someone

public text v1 · immutable
#93499 ·published 2006-07-20 14:38 UTC
rendered paste body
<html>
<head>
<style type="text/css">
body, p {
	font-family: arial;
	font-size: 9pt;
}

.helpPopup {
	font-family: arial;
    background-color: #fff; 
    filter: alpha(opacity=90);
    display: none;
    position: absolute;
    z-index: 10000;
    padding: 5px;
    width: 300px;
    height: 100px;
    color: #000;
    border: 2px #639 solid;
}
.helpTitle {
	color: #444;
	font-size: 10pt;
	font-weight: bold;
}

.helpDesc {
	color: #444;
	font-size: 9pt;
}

.helpClose {
	font-size: 9pt;
	text-align: right;
	vertical-align: bottom;
	padding: 0px;
}

.helpClose a {
	color: #fa7408;
}


img.help {
	cursor: help;
}

#labels li {
	display: block;
}


</style>
<script type="text/javascript">

<!--

	/**
	 *	showHelpTip
	 *	-------------------------
	 *	Show the help tip div (with id = div)
	 */
	function showHelpTip(div) {
		if (document.getElementById){
			id = document.getElementById(div);
	
		    id.style.display = "block";
		    id.style.left = event.clientX + document.body.scrollLeft + 2;
			id.style.top = event.clientY + document.body.scrollTop + 2;
	    }
	}
	
	/**
	 *	hideHelpTip
	 *	-------------------------
	 *	Hide the help tip div (with id = div)
	 */
	function hideHelpTip(div) {
		if (document.getElementById) {
			id = document.getElementById(div);
	        id.style.display = "none";
		}
	}
	
//-->

</script>
</head>

<body>
<p>&nbsp;</p>

<img src="help.gif" onClick="showHelpTip('label1')" class="help">Label1<br/>
<img src="help.gif" onClick="showHelpTip('label2')" class="help">Label2<br/>
<img src="help.gif" onClick="showHelpTip('label3')" class="help">Label2<br/>

<div id="helpTips">
	<div id="label1" class="helpPopup">
		<div class="helpTitle">Help title1</div>
	    <div class="helpDesc">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </div>
		<div class="helpClose"><a href="javascript:hideHelpTip('label1');">close</a></div>	
	</div>
	<div id="label2" class="helpPopup">
		<div class="helpTitle">Help title2</div>
	    <div class="helpDesc">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </div>
		<div class="helpClose"><a href="javascript:hideHelpTip('label2');">close</a></div>
	</div>
	<div id="label3" class="helpPopup">
		<div class="helpTitle">Help title3</div>
	    <div class="helpDesc">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </div>
		<div class="helpClose"><a href="javascript:hideHelpTip('label3');">close</a></div>
	</div>
</div>


</body>
</html>