Søg
Avatar billede manon Nybegynder
04. juli 2003 - 02:01 Der er 24 kommentarer og
3 løsninger

Hvordan kan jeg lave en "Tekst popup" på dette script?

Hej E

[Det kan være at spm måske hører hjemme i dHTML kategorien - i så fald beklager jeg og flytter spm asap]

Mit spm går ud på følgende:

Da jeg ikke er en haj til hardcore kodning, vil jeg høre eksperterne om det kan lade sig gøre og hvordan en kode ville se ud, hvis man ønskede en slags "POPUP" som består af TEKST når musen køres over linket.

I dette script, som er fundet hos Brattli, kunne jeg godt tænke mig at der kom en slags tekstforklaring vha. af en popup når musen køres over linket - ligesom ALT funktionen - bortset fra at ALT funktionen er for langsom.


Scriptet ser således ud:

<div id="div0" class="clButtons"><a href="#" onclick="mclick(0); parent.focus(); return false" onmouseover="mover(0)" onmouseout="mout(0)"><img src="circlemenu1.gif" name="img0" width=22 height=22 border=0 alt="Hvis tekst vha. alt"></a></div>


Det jeg så godt kunne tænke mig var følgende:

<div id="div0" class="clButtons"><a href="#" onclick="mclick(0); parent.focus(); return false" onmouseover="mover(0)" onmouseout="mout(0)"><img src="circlemenu1.gif" name="img0" width=22 height=22 border=0 alt="">Denne tekst skulle først vises ved mouseon</a></div>

Hvordan får jeg implementeret en mouseon tekstpopup?


Det burde være noget i denne retning:

<div id="div0" class="clButtons"><a href="#" onclick="mclick(0); parent.focus(); return false" onmouseover="mover(0)+ (DETTE ER TEKST TIL MOUSEON MED LINKFORKLARING)" onmouseout="mout(0)"><img src="circlemenu1.gif" name="img0" width=22 height=22 border=0 alt=""></a></div>

På forhånd tak for hjælpen.

vh\Michael
Avatar billede ahv Nybegynder
04. juli 2003 - 02:09 #1
http://www.bosrup.com/web/overlib/
Avatar billede bearhugx Nybegynder
04. juli 2003 - 02:10 #2
er det noget ala.
http://exp.skroeder.dk/372450/test1.html
du leder efter ?
Avatar billede bearhugx Nybegynder
04. juli 2003 - 02:13 #3
ahv >> wow  - jeg vidste ikke at der var lavet et helt library med forskellige "tool-tip" muligheder! Det er faktisk ret flot :-))

(det er formentligt også derfra (dog af omveje) at jeg i tidernes morgen fik min kode...
Avatar billede roenving Novice
04. juli 2003 - 02:34 #4
>>bearhugx
-- og (vil jeg tilføje ,-) et enorm funktionalitet, som dog skal overvejes grundigt, da scriptet har en voldsom kompleksitet, som kan være enormt svært at kombinere med nogle bare grundlæggende funktionaliteter i andre javascript-ting ...

Forøvrigt den samme kommentar, man kan komme med til nogle af de mere avancerede menu-scripts, som vi vist kender en hel del til herinde *g*
Avatar billede manon Nybegynder
04. juli 2003 - 05:22 #5
ahv >>
Kender godt Overlib og bruger den også en nogle af mine gamle sider. Men hvordan vil du sætte overlibkoden ind - jeg kan ikke få det til at virke.

bearhugs >>
ja, det er sådan noget jeg leder efter - du bruger dette script her: "<a href="#" onMouseOver="toolTip('Her er en tekst');" onMouseOut="toolTip();">Link her - kør musen over..</a>" - og jeg ved ikke lige hvordan jeg skal sætte den ind/implementere den i min kode:

"<div id="div0" class="clButtons"><a href="#" onclick="mclick(0); parent.focus(); return false" onmouseover="mover(0)" onmouseout="mout(0)"><img src="circlemenu1.gif" name="img0" width=22 height=22 border=0 alt="Hvis tekst vha. alt"></a></div>"

roenving >>
Ja, men det burde måske være let at tilføje en funktion der popper noget tekst op ved en mouseover/on funktion.
Avatar billede cdc Novice
04. juli 2003 - 08:11 #6
skal din text vises samme sted hver gang, eller skal det være som  overlib
Avatar billede manon Nybegynder
04. juli 2003 - 15:16 #7
cdc >>
Det må gerne fungere som overlib.
Avatar billede manon Nybegynder
04. juli 2003 - 15:17 #8
cdc >>
Eller samme sted - det har faktisk ingen betydning.
Avatar billede roenving Novice
04. juli 2003 - 15:40 #9
Dette er bare et eksempel, hvor det er en span, som får en ny tekst, nå man er et bestemt sted, men det kan også sagtens gøres med en fast positioneret ting (din kommentar 15:17:05 ,-)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE>Mouse-over Tekst</TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</HEAD>
<BODY>
<BR>
<FORM ID="minForm" NAME="minForm">
<INPUT ID="minInput" NAME="minInput" TYPE="text" VALUE="Tom" ONFOCUS="if(this.value==this.defaultValue)this.value='';" ONBLUR="if(this.value=='')this.value=this.defaultValue;" onmouseover="document.getElementById('minSpan').innerHTML='Hov!<p style=\47font-size:16px;font-weight:bold;color:red;\47>Det er ikke iorden at taste her</p>'" ID="minInput" SIZE="20">
<BR>
<SPAN ID="minSpan">En span-tekst</SPAN>
</BODY>
</HTML>
Avatar billede manon Nybegynder
05. juli 2003 - 04:13 #10
roenving >>
Hmmm .. kan se funktionen, men ved ikek lige hvordan jeg kunne sætte det 2 scripts sammen.
Avatar billede roenving Novice
05. juli 2003 - 04:40 #11
Kan du så ikke komme med en lidt nærmere definition for hvordan du vil bruge det -- denne måde at gøre det på er jo vidt forskellig fra overlib-funktionen ...

En bedre sammenligning er vel at sammenligne den med at man skriver en besked i status-linjen men gør den iøjefaldende ved at placere den midt på skærmen ,-)

Det var jo som skrevet et ekstremt simpelt eksempel -- vent lige lidt, så kan jeg smide nogle div'er ind, så du kan se mulighederne med rundt på skærmen !-)

-- fordi vi bruger de nyere muligheder for at skrive html til elementer til et valgfrit element, er mulighederne næsten uendelige ...

-- her til morgen bliver det dog ved eksemplerne -- resten må vi arbejde videre med i morgen, hvis det er noget -- okay ?o]
Avatar billede roenving Novice
05. juli 2003 - 04:56 #12
Se mulighederne -- stadig på det ekstremt simple niveau, hvis vi involverer et par få små funktioner og et stylesheet er det godt nok svært at se begrænsningerne:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE>Mouse-over Tekst</TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</HEAD>
<BODY>
<DIV ID="minDiv1" STYLE="position:absolute;top:240px;left:150px;background:orange;width:150px;height:50px;display:none;font:24px verdana;color:darkred;text-align:center;">For f***** -- du må ik' være der!</div>
<BR>
<FORM ID="minForm" NAME="minForm">
<INPUT ID="minInput" NAME="minInput" TYPE="text" VALUE="Tom" ONFOCUS="if(this.value==this.defaultValue)this.value='';" ONBLUR="if(this.value=='')this.value=this.defaultValue;" onmouseover="document.getElementById('minSpan').innerHTML='Hov!<p style=\47font-size:16px;font-weight:bold;color:red;\47>Det er ikke iorden at taste her</p>'" ID="minInput" SIZE="20">
<TABLE WIDTH="100%"><TR><TD HEIGHT="300" WIDTH="200">Her må man godt være</TD><TD WIDTH="60" BGCOLOR="green" onmouseover="document.getElementById('minDiv1').style.display='block';" onmouseout="document.getElementById('minDiv1').style.display='none';">Her må man ikke komme</TD><TD WIDTH="400">Også her må man godt komme !</TD>

<BR>
<SPAN ID="minSpan">En span-tekst</SPAN>
</BODY>
</HTML>
Avatar billede cdc Novice
05. juli 2003 - 08:29 #13
Jeg bruger selv denne, se i menuen: http://hjem.get2net.dk/arntsen/exp/
Avatar billede roenving Novice
05. juli 2003 - 13:24 #14
Dit spm er forøvrigt ret let at klare (med udgangspunkt i min kommentar 15:40:57 ,-)

<div id="div0" class="clButtons"><a href="#" onclick="mclick(0); parent.focus(); return false" onmouseover="mover(0);document.getElementById('cSpan').style.display:block;" onmouseout="mout(0);document.getElementById('cSpan').style.display:none;"><img src="circlemenu1.gif" name="img0" width=22 height=22 border=0 alt=""><span id="cSpan" style="display:none;">Denne tekst skulle først vises ved mouseon</span></a></div>

-- men med dine kommentarer og involvering af Overlib kan man jo få tanken, at du har andre ideer (bla. betyder ovenstående -- sandsynligvis -- at ting flytter sig) -- og så er det jo nok metoden 04:56:19 i en eller anden form, der skal udnyttes !-)
Avatar billede manon Nybegynder
05. juli 2003 - 15:12 #15
roenving >>

Fint med alle de gode muligheder, men jeg kan desværre ikke bruge dem - umiddelbart ser jeg ingen ggrund til at have så et kompliceret script - det burde kunne lade sig gøre - på en simpel måde - at indføre en ekstra funktion ala [alt=""] ved [onmouseover="mover(0)"] - spørgsmålet er bare hvordan.
Avatar billede roenving Novice
05. juli 2003 - 15:20 #16
Jamen, der er jo en alt på billedet -- den er da lige til at bruge, men der findes også en title for alle mulige andre html-ting med samme funktion:

<div id="div0" class="clButtons"><a href="#" onclick="mclick(0); parent.focus(); return false" onmouseover="mover(0)" title='DETTE ER TEKST TIL MOUSEON MED LINKFORKLARING' onmouseout="mout(0)"><img src="circlemenu1.gif" name="img0" width=22 height=22 border=0 alt=""></a></div>

Det hører med, at det IKKE virker lige der, fordi img-taggets alt-funktion overtager ...
Avatar billede manon Nybegynder
05. juli 2003 - 15:32 #17
roenving >>
Sagen er bare, at ALT funktionen er utrolig langsom og det tager 1 sekunder for meget før den popper op.
Avatar billede roenving Novice
05. juli 2003 - 15:43 #18
Så prøv med denne, som kan vise hvordan det kan gøres, men skal det virke for alvor, skal der altså lidt mere til, for så kan vi ikke nøjes med den metode, jeg finder stedet på:

<html><BODY>
<br><br><br><br><br><DIV id="d" onmouseover="q=document.getElementById('d');" STYLE="position:absolute;height:40;width:100;background:#ffffe6;border:1px solid black;display:none;"></div>
<div id="div0" class="clButtons">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a href="#" onclick="" onmouseover="q=document.getElementById('d');q.style.top=this.offsetTop;q.style.left=this.offsetLeft;q.innerHTML='Vis tekst vha. DIV';q.style.display='block';" onmouseout="document.getElementById('d').style.display='none';">
<img src="circlemenu1.gif" name="img0" width=22 height=22 border=0 alt=""></a></div></BODY></HTML>
Avatar billede manon Nybegynder
05. juli 2003 - 16:58 #19
roenving >>
Hmmm .. så bliver onmouseover="mover(0)" og onmouseout="mout(0)" ødelagt.
Avatar billede roenving Novice
05. juli 2003 - 17:03 #20
Ja, dem var jeg jo nødt til at slette fra mit eksempel, da jeg ikke kendte deres indhold og funktion, men måske kan vi komme udenom det ?-)

Hvad er det de gør ?o]
Avatar billede manon Nybegynder
05. juli 2003 - 18:02 #21
roenving >
Det kan du se på http://www.dhtmlcentral.com/script/script.asp?id=14
Avatar billede roenving Novice
06. juli 2003 - 02:25 #22
Jeg tog ikke al grafikken med, men havde ellers ikke problemer, med gøre sådan:

    <div id="div0" class="clButtons"><a href="#" onclick="mclick(0); parent.focus(); return false" onmouseover="mover(0);q=document.getElementById('d');q.style.top=this.offsetTop;q.style.left=this.offsetLeft;q.innerHTML='Vis tekst vha. DIV';q.style.display='block';" onmouseout="mout(0);document.getElementById('d').style.display='none';"><img src="circlemenu1.gif" name="img0" width=22 height=22 border=0 alt=""></a></div>

Bortset fra den jeg beskrev, med at offset kun dur i simple omgivelser, men den kender jeg godt løsningen på ...
Avatar billede manon Nybegynder
22. juli 2003 - 08:42 #23
roenving >>
Vil du venligst besvare så jeg kan lukke dette spm..
Avatar billede roenving Novice
22. juli 2003 - 23:14 #24
*gg*

-- du går virkelig efter at få ryttet ud !-)
Avatar billede manon Nybegynder
22. juli 2003 - 23:25 #25
Hvad mener du *fløjter* *s*
Avatar billede roenving Novice
23. juli 2003 - 02:10 #26
*g*
-- og tak da for den voldsomme indtægt på min point-konto ;~}
Avatar billede manon Nybegynder
23. juli 2003 - 02:17 #27
måske kan du tjene mere her http://www.eksperten.dk/spm/378870
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 JavaScript kategorien

Titel Indlæg Oprettet Seneste aktivitet
problem med download i <a href=" " download> tag i JavaScript Af Peer i JavaScript 5 27/04/202620:09 21/08/202610:41
Validering af filnavn i formular Af Strawberry i JavaScript 8 14/04/202610:11 20/04/202611:14
Mangler et JavaScript til htm side med iframe i Joomla5 Af Peder Lund Nielsen i JavaScript 2 03/02/202614:19 04/04/202616:02
Åbne en PDF fil fra en mappe Af mbl i JavaScript 9 18/04/202516:52 22/04/202512:33
Spørgsmål til cookies Af Mads i JavaScript 2 14/02/202511:47 27/06/202514:34
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 20:17 Kan man kopiere en DVD og afspille den på * Linux Mint - Cinnamon - 22.1 - "Xia" * ? Af Ikke-ekspert i Linux
27/0821:03 Kan man få Word viewer gratis Af Strawberry i Word
26/0813:28 Findes der en brugsanvisning til : "ONKYO Stereo Casette - Tape Deck - R1" Af Ikke-ekspert i Musik & videoafspillere
24/0820:07 Libra Office 26.2.5.2 - Er sort - Kan an ændre til lysere baggrund ? (Windows 11) Af Ikke-ekspert i Office & Kontorpakker
24/0811:24 Hvor kan jeg finde hjælp til at flytte fra min gamle Samsung Flip4 til min nye Samsung Galaxy S24 Af vbr i Apps til Android
White papers
Flere white papers »