Søg
Avatar billede mik789 Nybegynder
24. juli 2002 - 12:54 Der er 12 kommentarer og
1 løsning

visningshastighed for title="tekst"

Med title="din tekst" får man en boks svarende til alt="tekst" i <img>. Den kan bruges i links, knapper og vel i alle andre synlige elementer. Bliver brugt her på Eks. f.eks. på feltet "Udfør" hvor man skriver sine kommentarer/svar.

Men er der nogen mulighed for at regulere den tid der går fra musen er over elementet til boksen popper op. I IE går der en anelse for lang tid synes jeg. Folk har trykket eller er smuttet inden boksen viser sig.
Avatar billede mik789 Nybegynder
24. juli 2002 - 13:04 #1
Af en eller grund understøtter NS6 ikke alt="tekst" i <img>, men gerne title="tekst". Men man kan indsætte begge dele uden problemer (hvis man undlader alt validerer xhtml dokumneter ikke) og så få boksen alligevel uden at der går kludder i det af den grund.
Avatar billede Slettet bruger
24. juli 2002 - 13:06 #2
<html>
<head>
<script>
x = 30; //Så langt til højre tippet skal være fra cursoren
y = 30; //Så langt nedenunder tippet skal være fra cursoren
tid = 1000; //Antal millisekunder, før tippet skal dukke op
ftid = 2000; //Antal millisekunder, før tippet skal forsvinde EFTER det er dukket op

paa = false;
var to1;
var to2;
function vis(txt) {
obj("tiptxt").innerHTML = txt;
obj("tip").style.left = event.clientX + 30;
obj("tip").style.top = event.clientY + 30;
to1 = setTimeout("obj('tip').style.visibility = 'visible';", tid);
paa = true;
to2 = setTimeout("skjul();", ftid + tid);
}

function skjul() {
clearTimeout(to1);
clearTimeout(to2);
obj("tip").style.visibility = "hidden";
paa = false;
}

function mov() {
if (paa) {
obj("tip").style.left = event.clientX + 30;
obj("tip").style.top = event.clientY + 30;
}
}

function obj(id) {
if (document.getElementById)
return document.getElementById(id);
else if (document.all)
return document.all[id];
}
</script>
</head>
<body onMouseMove="mov();">
<div id="tip" style="position: absolute; left: -200; top: -200; visibility: hidden;">
<div id="tiptxt" style="background-color: yellow; font-family: Verdana;">
</div>
</div>
<form>
<input type="checkbox" onMouseOver="vis('Checkbox nr. 1');" onMouseOut="skjul();"><br>
<input type="checkbox" onMouseOver="vis('Checkbox nr. 2');" onMouseOut="skjul();"><br>
<input type="checkbox" onMouseOver="vis('Checkbox nr. 3');" onMouseOut="skjul();"><br>
</form>
</body>
</html>
Avatar billede Slettet bruger
24. juli 2002 - 13:07 #3
Du kan selvfølgelig bruge andet end checkbokse, fx billeder:

<img src="bla.gif" onMouseOver="vis('Mit billede');" onMouseOut="skjul();">
Avatar billede mik789 Nybegynder
24. juli 2002 - 13:17 #4
phoenix> ja, det er selvfølgelig en løsning, men noget mere kompliceret end bare en attribut i html koden. Så vidt jeg kan se virker det dog kun i IE (jeg mener ikke NS understøtter innerHTML). Men tak for koden. Hvis ikke der dukker andre løsninger op, bruger jeg den.
Avatar billede nikolajdu Nybegynder
24. juli 2002 - 14:06 #5
NS6/NS7 understøtter fint innerHTML
Avatar billede Slettet bruger
24. juli 2002 - 15:12 #6
Du kan ikke styre farve, font eller hastighed på alt og title attributterne.
Avatar billede mik789 Nybegynder
24. juli 2002 - 16:30 #7
nikolajdu> OK..., ,em når jeg tester phoenixv's kode virker tips-boksene alligevel ikke ...?

phoenix> tak for scriptet anyway
Avatar billede mik789 Nybegynder
24. juli 2002 - 16:30 #8
,em == men - og dvs i NS6
Avatar billede Slettet bruger
25. juli 2002 - 09:46 #9
Det er fordi, NS6 håndterer events på andre måder. Lige et øjeblik...
Avatar billede Slettet bruger
25. juli 2002 - 09:56 #10
OK, final version - testet i IE5 og NS6:

<html>
<head>
<script>
x = 30; //Så langt til højre tippet skal være fra cursoren
y = 30; //Så langt nedenunder tippet skal være fra cursoren
tid = 1000; //Antal millisekunder, før tippet skal dukke op
ftid = 2000; //Antal millisekunder, før tippet skal forsvinde EFTER det er dukket op

ns6 = (document.getElementById && !document.all);
ie5 = (document.getElementById && document.all);
ie4 = (!document.getElementById && document.all);

mx = 0;
my = 0;
paa = false;
var to1;
var to2;
function vis(txt) {
obj("tiptxt").innerHTML = txt;
obj("tip").style.left = mx + 30;
obj("tip").style.top = my + 30;
paa = true;
to1 = setTimeout("obj('tip').style.visibility = 'visible';", tid);
to2 = setTimeout("skjul();", ftid + tid);
}

function skjul() {
clearTimeout(to1);
clearTimeout(to2);
obj("tip").style.visibility = "hidden";
paa = false;
}

function mov(e) {
mx = (ns6) ? e.clientX : event.clientX;
my = (ns6) ? e.clientY : event.clientY;
if (paa) {
obj("tip").style.left = mx + 30;
obj("tip").style.top = my + 30;
}
}

function obj(id) {
if (ns6 || ie5)
return document.getElementById(id);
else if (ie4)
return document.all[id];
}

document.onmousemove = mov;
</script>
</head>
<body>
<div id="tip" style="position: absolute; left: -200; top: -200; visibility: hidden;">
<div id="tiptxt" style="background-color: yellow; font-family: Verdana;">
</div>
</div>
<form>
<input type="checkbox" onMouseOver="vis('Checkbox nr. 1');" onMouseOut="skjul();"><br>
<input type="checkbox" onMouseOver="vis('Checkbox nr. 2');" onMouseOut="skjul();"><br>
<input type="checkbox" onMouseOver="vis('Checkbox nr. 3');" onMouseOut="skjul();"><br>
</form>
</body>
</html>
Avatar billede Slettet bruger
25. juli 2002 - 09:58 #11
Den vil forøvrigt også kunne udvides til at virke i NS4, men så er vi ved at være udei grænselandet for mine crossbrowser-kundskaber!
Avatar billede mik789 Nybegynder
25. juli 2002 - 10:30 #12
phoenix> yep, det virker fint nu. takker igen. jeg er holdt op med at tage højde for ns4. browsere er gratis nu om dage. folk må opdatere.
Avatar billede Slettet bruger
27. juli 2002 - 17:55 #13
Enig! :)

(så behøver vi travle programmører heller ikke at være så skide bagudkompatible) :)
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
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel Indlæg Oprettet Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML 18 10/09/202515:07 17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML 3 19/03/202522:16 20/03/202513:04
Se og ændre html på en webside Af magger i HTML 4 11/03/202513:55 12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML 5 02/03/202520:05 04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML 3 30/10/202409:37 01/01/202515:27
Se alle spørgsmål i kategorien Opret spørgsmål

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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I går 16:43 Nomad Tracking Car Af fleknes i Apps til Android
25/0916:15 Internet forsvinder hele tiden Af TTA i Internetforbindelser
23/0920:49 Fejl på Tv2 Play Af Bukse i Browsere
23/0918:11 VB, Lægge 2 celler sammen og skrive den i cellen ved side af Af MC3390 i Excel
21/0910:39 DBA er ikke hvad det tidligere var - desværre! Af ErikHg i Fri debat
White papers
Flere white papers »