Har prøvet at lave et hurtigt eksempel på sagen :o)
- kan med statsgaranti optimeres ;o)
<html>
<head>
<style type="text/css">
body,html{
cursor: auto;
}
#tip {
position:absolute;
border:1px solid #000;
font-size:10px;
width:150px;
background-color:#FCFDC7;
display:none;
padding:3px;
}
</style>
<script type="text/javascript">
var h=0,ie=(document.all)?1:0,txt=[];
//hjælpetekster
txt[0] = "Link Hjælp 1"; //hjælpetekst til help0 etc.
txt[1] = "Link Hjælp 2";
txt[2] = "Link Hjælp 3";
txt[3] = "Tekst Hjælp 1";
txt[4] = "Textarea Hjælp 1";
function hjlp(b){
h=(h==0)?1:0;
b.innerHTML = (h)?"Hjælp fra":"Hjælp til";
document.body.style.cursor = (h)?"help":"auto";
e = document.getElementsByTagName("*")
for(i=0;i<e.length;i++){
if(e[i].id && e[i].id.indexOf("help")==0){
if(ie){
e[i].onmouseover = (h)?new Function("vis(event,'"+e[i].id+"')"):"";
e[i].onmouseout = (h)?new Function("skjul('','"+e[i].id+"')"):""}
else{
if(h){
e[i].addEventListener('mouseover',vis,false);
e[i].addEventListener('mouseout',skjul,false);}
else{
e[i].removeEventListener('mouseover',vis,false);
e[i].removeEventListener('mouseout',skjul,false);}
}
}
}
}
function vis(e,o){
if(!e)e=window.event;
o=(!o)?this:document.getElementById(o);
t=document.getElementById("tip");
o.style.cursor = "help";
s = parseInt(o.id.substring(4));
t.innerHTML = txt[s];
t.style.top = (ie)?(e.clientY+document.body.scrollTop)+"px":(e.pageY+20)+"px";
t.style.left = (ie)?(e.clientX+document.body.scrollLeft+10)+"px":(e.pageX)+"px";
t.style.display = "inline";
}
function skjul(e,o){
t=document.getElementById("tip");
o=(!o)?this:document.getElementById(o);
o.style.cursor = "auto";
t.style.display = "none";
}
</script>
</head>
<body>
<a href="#" id="help0">Link 1</a><br />
<a href="#" id="help1">Link 2</a><br />
<a href="#" id="help2">Link 3</a><br />
<span id="help3">
en masse tekst sajkdfkadsjfhkjsadfkjsafg
</span>
<form>
<textarea id="help4"></textarea>
</form>
<b><a href="#" onclick="hjlp(this);">Hjælp til</a></b>
<div id="tip"></div>
</body>
</html>
