All pastes #729621 Raw Edit

Untitled

public text v1 · immutable
·published 2007-10-08 04:28 UTC
rendered paste body
## create a file named: tooltip.js with this in it ##

function tooltip(tip)
{
    if(!document.getElementById('tooltip')) newelement('tooltip');
    var lixlpixel_tooltip = document.getElementById('tooltip');
    lixlpixel_tooltip.innerHTML = tip;
    lixlpixel_tooltip.style.display = 'block';
    document.onmousemove = getmouseposition;
}


## place this code at the top of your page where you will use the image thingy ##

<script type="text/javascript" src="tooltip.js"></script>

## use this css as the location of the area you want to hover over ##
## you will need to mess with the left and top values to possition the box in the correct place. ##
## Then mess with the width and height to change the box size ##

<style type="text/css">
#hotspot {
	position:absolute;
	left:451px;
	top:297px;
	width:211px;
	height:123px;
	z-index:1;
}
</style>


## this is your image and the div tag for the hotspot ##
## the hotspot code can be put anywhere in the body as it is being possition with the above css code.##

<img src="images/image.gif" alt="" />
<div id="hotspot" onmouseover="tooltip('Description of the item hovered over');" onmouseout="exit();" ></div>

## i am going to bed so hopefully this works for you, if not i will help you tomarrow, check out #css to help you with the absolute possitioning... ##