Vraag & Antwoord

Webdesign (HTML, CSS, Flash)

Tooltip na klikken link of tekst in pop up

15 antwoorden
  • Hallo, Ik wil op mijn pagina links zetten die nergens heen verwijzen maar alleen een tooltip in zich hebben (Zo een gele tekst die verschijnt). Deze tekst verschijnt als je bv 1 seconde op de link staat, Is het ook mogelijk dat de tooltip verschijnt wanneer ik op de link klik. Of een andere optie, als ik de link klik er een klein popup verschijnt met een van te voren ingegeven tekst (dus zodat ik geen apparte html pagina hoef aan te maken) Als iemand een optie weet hoor ik dat graag, Vr Gr Mike Zwetsloot
  • de snelste oplossing is het title attribuut: <span title="hoi">blaaaaaat</span> grtzz t. ps; ik heb je mail gelezen, antwoord komt nog. :)
  • probeer dit eens, ik heb het zelf gemaakt. Ik hoop dat je er wat aan hebt. Ik neem aan dat je het zelf wel kunt aanpassen hier en daar. ................ jelmer [code:1:a626e4166f] <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Untitled</title> <style> .tt{ background-color : #F5F5DC; border : thin solid Black; } </style> </head> <body> <SCRIPT LANGUAGE="javascript" TYPE="text/javascript"> var nav = (document.layers); var x = 0; var x_offset = 5; var y = 0; var y_offset = 15; if(nav) document.captureEvents(Event.MOUSEMOVE); document.onmousemove = get_mouse; function reset(){ nav = (document.layers); x = 0; x_offset = 5; y = 0; y_offset = 15; } function get_mouse(e) { x = (nav) ? e.pageX : event.clientX+document.body.scrollLeft; y = (nav) ? e.pageY : event.clientY+document.body.scrollTop; x += x_offset; y += y_offset; } // --> // start tooltip 1 function show_tt1(){ get_mouse() document.all.tt1.style.left = y document.all.tt1.style.top = x document.all.tt1.style.visibility='visible'; } function hide_tt1(){ document.all.tt1.style.visibility='hidden'; reset() } // einde tooltip 1 //start tooltip 2 function show_tt2(){ get_mouse() document.all.tt2.style.left = x document.all.tt2.style.top = y document.all.tt2.style.visibility='visible'; } function hide_tt2(){ document.all.tt2.style.visibility='hidden'; reset() } // einde tooltip 2 /* om er nog een tooltip bij te maken, kopieer hetvolgende, plak het onder de vorige en vervang *n* door het volgende cijver; //////////////////////////////////// function show_tt*n*(){ document.all.tt*n*.style.left = y document.all.tt*n*.style.top = x document.all.tt*n*.style.visibility='visible'; } function hide_tt*n*(){ document.all.tt*n*.style.visibility='hidden'; } ////////////////////////////////////// de rest snap je vast zelf wel, alleen vergeet niet de cijfertjes te veranderen */ </SCRIPT> <a href="#" onclick="show_tt1()" onmouseout="hide_tt1()">show text1</a><br><br><br><br><br><br><br> <a href="#" onclick="show_tt2()" onmouseout="hide_tt2()">show text2</a> <div class="tt" style="position:absolute;visibility:hidden;" id="tt1"> ik zie text1 </div> <div class="tt" style="position:absolute;visibility:hidden;" id="tt2"> ik zie text2 </div> </body> </html> [/code:1:a626e4166f]
  • Naast de title tag is er ook de [url=http://www.w3.org/TR/REC-html40/struct/text.html#edef-ACRONYM] ACRONYM [/url] tag. Een voorbeeld op [url=http://www.kennsarah.net/archives/2003/04/08/the_acronym_tag/] deze [/url] pagina. wimb
  • Hallo, ik heb inmiddels een script gevonden (bovenstaande is ook erg handig, maar deze is variabel in plaats en je kan hem zelf wegklikken) Nu wil ik hem alleen op roepen doordat er op een bepaalde link word geklikt, om duidelijk te maken wat ik bedoel kan je hier even kijken: http://mikezwet.tripod.com/printtest.html Ik hoop dat iemand een oplossing weet, Vr Gr Mike Zwetsloot
  • [quote:1b6520c890="WimB"]Een voorbeeld op [url=http://www.kennsarah.net/archives/2003/04/08/the_acronym_tag/] deze [/url] pagina.[/quote:1b6520c890]Daar staan dus mooi allemaal verkeerde voorbeelden op :). HTML != acronym, HTML == abbr. Dat geldt ook voor de rest van de voorbeelden. Als je het woord uit kunt spreken en het is tevens een afkorting dan is het een acronym. [url=http://www.evolt.org/article/HTML_is_not_an_acronym/17/35750/index.html]Meer....[/url] Anne
  • Hallo, ik heb inmiddels een script gevonden (bovenstaande is ook erg handig, maar deze is variabel in plaats en je kan hem zelf wegklikken) Nu wil ik hem alleen op roepen doordat er op een bepaalde link word geklikt, om duidelijk te maken wat ik bedoel kan je hier even kijken: http://mikezwet.tripod.com/printtest.html Ik hoop dat iemand een oplossing weet, Vr Gr Mike Zwetsloot
  • [code:1:ca41ae91e5]document.getElementById('divid').style.display = "none"[/code:1:ca41ae91e5]Zoiets (Dit is om te verbergen om het weer weer te geven kun je i.p.v. none "block: gebruiken)? Anne
  • Bedankt voor je reactie, maar ik heb geen flauw idee hoe ik die regel moet gebruiken. Het is dus de bedoeling dat het script die het pop-upje maakt, pas opent wanneer iemand op de link klikt................. maar hoe? Vr Gr Mike Zwetsloot
  • [list:25248c2576][*:25248c2576][url=http://www.google.nl/search?hl=nl&ie=UTF-8&oe=UTF-8&q=document.getElementById%28%27divid%27%29.style.display+%3D+%22none%22&btnG=Google+zoeken&lr=]Zoek![/url] [*:25248c2576][url=http://simon.incutio.com/archive/2003/07/24/learnToSearch]Simon Willison: Learn to search![/url][/list:u:25248c2576]Anne
  • Sorry ben er nog steeds niet uit, ik heb nog even verduidelijkt wat de bedoeling is, op: http://mikezwet.tripod.com/printtest.html Als iemand het weet hoor ik het wel, Vr Gr Mike Zwetsloot
  • Zoiets ongeveer? [code:1:88160b0a0a] <script type="text/javascript"> x=document.getElementById('showimage');x.style.display='none'; function aanuit(){ x.style. display=='block'?x.style.display='none':x.style.display='block'; } </script> <a href="javascript:aanuit();">Bovenstaande Tekst box wil ik op laten komen doordat op deze link word geklikt, dus hij mag er niet staan zodra de pagina geopent word</a> [/code:1:88160b0a0a]
  • Hallo hulpje, Dit werkt!! :) Het enige is dat ik nu het "sluitkruisje" is het pop upje zelf niet meer kan gebruiken om het menu weg te klikken maar weer op de link moet klikken om hem weg te krijgen, Is er een oplossing om de functie van het kruisje weer te krijgen? En ik ben ook aan het proberen geweest om er 2 in 1 pagina te krijgen maar dat lukte ook niet echt. Vr Gr Mike Zwetsloot, ps hij staat weer online in de nieuwe versie :wink:
  • Gebruik voor het kruisje bij de onclick event handler gewoon dezelfde functie als bij de link. Ik zou trouwens gewoon die andere javascript zooi verwijderen, want die heb je in principe niet meer nodig. [quote:15dc36cfd7] En ik ben ook aan het proberen geweest om er 2 in 1 pagina te krijgen maar dat lukte ook niet echt. [/quote:15dc36cfd7] Dat mag je zelf gaan proberen. Een beetje oefenen kan geen kwaad. :wink: Kijk gewoon naar wat je al hebt. Bedenk wel dat een id maar 1 keer mag voorkomen in het document.
  • Ok, hij doet het nu, alleen hij verschijnt metteen al als ik de pagina opstart, daar moet waarschijnlijk nog een regeltje bij die verteld dat het script niet opstart bij het openen van de pagina hij staat hier: http://mikezwet.tripod.com/hondaracers.html script: <a href="#"onClick="hide_tt1();return false"> heb onselectstart="hide_tt1();return false" geprobeert, maar dat werkt niet Vr Gr Mike Zwetsloot

Beantwoord deze vraag

Weet jij het antwoord op deze vraag? Registreer of meld je aan met je account

Dit is een gearchiveerde pagina. Antwoorden is niet meer mogelijk.