skriv ut »Popupinfo - overLIB
Detta script är en kombination av Jscript och CSS-lager, ett flexibelt sätt att ge information via popupmeddelanden.
(OBS! Din webläsare måste klara CSS2, lager/positionering, säkrast med webläsarversioner >4)
Prova exemplen nedan:
What overLIB does
En enkel popupruta
Popupruta med rubrik
Meddelande som fastnar... klicka här
Valfri html-kod
På andra sidan av muspekaren
Fixerad till ett rutnät
I en bestämd position
Som en transparent textruta
Scriptet är skrivet av Erik Bosrup. Mer information om overLIB finns på adressen:
http://www.bosrup.com/web/overlib
Steg 1:
Lägg koden inom <BODY>
OBS! Ta bort de delar av koden som motsvarar de exempel du inte vill ha!
<BODY>
<div id="overDiv" style="position:absolute;
visibility:hide;z-index:1;"></div>
<p>
<script language="JavaScript" src="overlib.js"></script>
<font size="3" color="#FFFFFF"><b> What
overLIB does</b></font><br>
En enkel <a href="javascript:void(0);"
onMouseOver="overlib('Ny variant eller hur?...')"
onMouseOut="nd()">popupruta</a></p>
<p>Popupruta med <a href="javascript:void(0);"
onMouseOver="overlib('...och texten här!',
CAPTION, 'Rubriken här...')" onMouseOut="nd()">rubrik</a></p>
<p>Meddelande som fastnar... <a
href="javascript:void(0);" onClick="overlib('Den
här rutan stannar ett tag...', STICKY, CAPTION,
'Fastnat?')" onMouseOver="overlib('klicka
här!')" onMouseOut="nd()">klicka
här</a></p>
<p>Valfri <a href="javascript:void(0);"
onMouseOver="overlib('Till exempel en punktlista:<UL><LI>Punkt
1<LI>Punkt 2<LI>Punkt 3</UL>')"
onMouseOut="nd()">html-kod</a></p>
<p> På andra sidan av <a
href="javascript:void(0);" onMouseOver="overlib('På
andra sidan!', LEFT)" onMouseOut="nd()">muspekaren</a></p>
<p>Fixerad till <a href="javascript:void(0);"
onMouseOver="overlib('Fixerad till en 20x20 pixels rutnät.',
SNAPX, 20, SNAPY, 20)" onMouseOut="nd()">ett
rutnät</a></p>
<p>I en <a href="javascript:void(0);"
onMouseOver="overlib('Den här är positionerad 50
pixlar i X-led och 250 pixlar i Y-led!', FIXX, 50,
FIXY, 250)" onMouseOut="nd()">bestämd
position</a></p>
<p>Som en transparent <a
href="javascript:void(0);" onMouseOver="overlib('<b>Här
är varianten med en transparent bakgrund och en färgad text!</b>',
TEXTCOLOR,
'#006699', WIDTH, 100, HEIGHT, 80,
BACKGROUND, 'transp_textruta.gif')"
onMouseOut="nd()">textruta</a>
</p>
</BODY>
Steg 2:
Spara Jscriptfilen
Du måste också ha en textfil som heter "overlib.js" då det är den som styr hela funktionen. Lägg den i samma mapp som din HTML-sida med scriptet.
Vill du använda exemplet med "transparent textruta" kan du högerklicka här för att spara ner en transparent GIF-bild. Du kan sedan styra storleken på på GIF-bilden i scriptkoden.
