Avatar billede klaestrup Nybegynder
11. marts 2005 - 19:28 Der er 1 kommentar

Hjælp til onMouseover Tooltip

Jeg har modificeret et tooltip script fra dynamicdrive en smule.
Jeg kunne godt tænke mig, at man både lægge faste tooltips ind i javascriptet (som jeg har gjort i flg.script), og ydermere definere dem i selve html koden, så man altså enten bruger denne model:

<a href="http://www.yahoo.com" onMouseover="tt(event,'Visit Yahoo.com')"; onMouseout="hidett()">Search Engine</a>

eller denne model:

<a href="http://www.yahoo.com" onMouseover="tt(event,1)"; onMouseout="hidett()">Search Engine</a>

Jeg bruger flg. script:

/***********************************************
* Cool DHTML tooltip script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
var messages = new Array();
messages[0] = new Array('Tekst 1',"#BBBBBB");
messages[1] = new Array('Tekst 2',"#DDDDDD");
messages[2] = new Array('Tekst 3',"#FFFFFF");


var offsetxpoint=-60 //Customize x offset of tooltip
var offsetypoint=20 //Customize y offset of tooltip
var ie=document.all
var ns6=document.getElementById && !document.all
var enabletip=false
if (ie||ns6)
var tipobj=document.all? document.all["dhtmltooltip"] : document.getElementById? document.getElementById("dhtmltooltip") : ""

function ietruebody(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function tt(evt,num){
    if (ns6||ie){
    if (messages[num][2]) tipobj.style.width=messages[num][2]+"px";
    else tipobj.style.width="190px";
    if (messages[num][1]) tipobj.style.backgroundColor=messages[num][1];
    else tipobj.style.backgroundColor="#DCDCDE";
    tipobj.innerHTML=messages[num][0];
    enabletip=true;
    return false;
    }
}

function positiontip(e){
if (enabletip){
var curX=(ns6)?e.pageX : event.x+ietruebody().scrollLeft;
var curY=(ns6)?e.pageY : event.y+ietruebody().scrollTop;
//Find out how close the mouse is to the corner of the window
var rightedge=ie&&!window.opera? ietruebody().clientWidth-event.clientX-offsetxpoint : window.innerWidth-e.clientX-offsetxpoint-20
var bottomedge=ie&&!window.opera? ietruebody().clientHeight-event.clientY-offsetypoint : window.innerHeight-e.clientY-offsetypoint-20

var leftedge=(offsetxpoint<0)? offsetxpoint*(-1) : -1000

//if the horizontal distance isn't enough to accomodate the width of the context menu
if (rightedge<tipobj.offsetWidth)
//move the horizontal position of the menu to the left by it's width
tipobj.style.left=ie? ietruebody().scrollLeft+event.clientX-tipobj.offsetWidth+"px" : window.pageXOffset+e.clientX-tipobj.offsetWidth+"px"
else if (curX<leftedge)
tipobj.style.left="5px"
else
//position the horizontal position of the menu where the mouse is positioned
tipobj.style.left=curX+offsetxpoint+"px"

//same concept with the vertical position
if (bottomedge<tipobj.offsetHeight)
tipobj.style.top=ie? ietruebody().scrollTop+event.clientY-tipobj.offsetHeight-offsetypoint+"px" : window.pageYOffset+e.clientY-tipobj.offsetHeight-offsetypoint+"px"
else
tipobj.style.top=curY+offsetypoint+"px"
tipobj.style.visibility="visible"
}
}

function hidett(){
if (ns6||ie){
enabletip=false
tipobj.style.visibility="hidden"
tipobj.style.left="-1000px"
tipobj.style.backgroundColor=''
tipobj.style.width=''
}
}

document.onmousemove=positiontip
Avatar billede klaestrup Nybegynder
15. marts 2005 - 10:44 #1
Er der virkelig ikke én der kan hjælpe? Ville tro, at det er rimelig simpelt, det der skal gøres...?
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester