DHTML - Tipp des Tages - Tip of the Day

Tipp des Tages ist eine Funktion, die von Windows-Programmen seit ca. 1995 bekannt ist. Dieses JavaScript erzeugt ein vergleichbares Fenster und besitzt ebenfalls die Möglichkeit, beim Start zukünftig nicht mehr angezeigt zu werden. Das Script wurde für diese WebSite eingedeutscht - soweit es die Benutzeroberfläche betrifft.
Die Zahl der Tipps ist durch die Menge der Tipps festgelegt.
Echtes HTML kann verwendet werden, um die Tipps zu formatieren. Anmerkung: Das Schließen mittels X-Button deaktivert das automatische Starten der Tipp des Tages auch dann, wenn »Tipps beim Start anzeigen« aktivert ist.

In Aktion zu sehen ist dieses JavaScript hier und auf der Startseite.

	Position in der html-Datei: body-Bereich und wird gestartet mit dem onload="totdinit()"-Ereignis. Alternativ kann das Script auch als externe Datei eingefügt werden.
<script type="text/javascript"> <!-- /* Script by Lefteris Haritou © 1999 http://www.geocities.com/~lef This script is free as long as you keep the above credit / bver=navigator.appVersion.split(";"); function totdstart() { if(bver[1].match("5.")) rv=window.showModalDialog("totd.html",null,"dialogWidth:430px;dialogHeight:280px;center:1;scroll:0;help:0;status:0"); else rv=window.showModalDialog("totd.html",null,"dialogWidth:430px; dialogHeight:300px; center:1; scroll:0; help:0"); nd= new Date(); nd.setTime (nd.getTime()+(365246060*1000)); cdomain = (location.domain) ? location.domain : null; cpath = (location.domain) ? location.pathname : null; if (rv!=0) SetCookie ("totdc", "true", nd, cpath, cdomain); } function totdinit() { if (document.all) { if (GetCookie("totdc")!="true") totdstart() else document.body.insertAdjacentHTML('beforeEnd','<div id = "etotd" style = "width:170; position:absolute; top:0,5cm; left:1cm; background-color:#B71717; border-bottom:#5C0000 solid 2px; border-left:#FE5E5E solid 2px; border-right:#5C0000 solid 2px; border-top:#FE5E5E solid 2px; font-family:Arial; font-size:8pt; font-weight:bold; text-align:center; padding-top:2px; padding-bottom:2px; color:#FFFFFF; cursor:default;" onclick = "enable()" onmouseover="mover()" onmouseout = "mout()">Activiere Tipp des Tages</div>'); } } function enable() { DeleteCookie("totdc"); etotd.innerHTML="Tipp des Tages ist aktiviert"; setTimeout('etotd.style.visibility="hidden";totdstart()',1000); } function mover() { etotd.style.borderLeftColor="#5C0000"; etotd.style.borderRightColor="#FE5E5E"; etotd.style.borderBottomColor="#FE5E5E"; etotd.style.borderTopColor="#5C0000"; etotd.style.paddingLeft="1px"; etotd.style.paddingTop="3px"; } function mout() { etotd.style.borderLeftColor="#FE5E5E"; etotd.style.borderRightColor="#5C0000"; etotd.style.borderBottomColor="#5C0000"; etotd.style.borderTopColor="#FE5E5E"; etotd.style.paddingLeft="0px"; etotd.style.paddingTop="2px"; } // Cookie Functions - Second Helping (21-Jan-96) // Written by: Bill Dortch, hIdaho Design <bdortch@netw.com> // The following functions are released to the public domain. function getCookieVal (offset) { var endstr = document.cookie.indexOf (";", offset); if (endstr == -1) endstr = document.cookie.length; return unescape(document.cookie.substring(offset, endstr)); } function GetCookie (name) { var arg = name + "="; var alen = arg.length; var clen = document.cookie.length; var i = 0; while (i < clen) { var j = i + alen; if (document.cookie.substring(i, j) == arg) return getCookieVal (j); i = document.cookie.indexOf(" ", i) + 1; if (i == 0) break; } return null; } function SetCookie (name, value) { var argv = SetCookie.arguments; var argc = SetCookie.arguments.length; var expires = (argc > 2) ? argv[2] : null; var path = (argc > 3) ? argv[3] : null; var domain = (argc > 4) ? argv[4] : null; var secure = (argc > 4) ? argv[5] : false; document.cookie = name + "=" + escape (value) + ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) + ((path == null) ? "" : ("; path=" + path)) + ((domain == null) ? "" : ("; domain=" + domain)); } function DeleteCookie(name) { exp=new Date(); exp.setTime (exp.getTime() - 1); var cval = GetCookie ("name"); document.cookie = name + "=" + cval +"; expires=" + exp.toGMTString(); } //--> </script>

	Nachfolgendes JavaScript muss in der Datei totdmsg.js (Kleinschreibung beachten) ausgelagert sein - und im gleichen Verzeichnis stehen wie die Seite, die die Tipps des Tages aufruft.
todmsg=new Array(); // Nachfolgend sind die Tipps einzugeben (oberhalb dieser Zeile nichts aendern) todmsg[0]="<b style=\"color:#880088;\">Tipp<\/b><br><br><i>EINS</i>" todmsg[1]="Tipp 2: echtes HTML ist möglich, lediglich die Anführungzeichen müssen maskiert werden mit einem <b>backslash</b> voran." todmsg[2]="das Original dieses JavaScripts erhältlich ist unter: <a href=\"http://www.geocities.com/~lef\">http://www.geocities.com/~lef</a>" todmsg[3]="Tipp 4" todmsg[4]="Tipp 5" todmsg[5]="Tipp 6" todmsg[6]="Tipp 7" todmsg[7]="Tipp 8" todmsg[8]="Tipp 9" todmsg[9]="Tipp 10" todmsg[10]="Tipp 11" todmsg[11]="usw."

	Nachfolgend der Quellcode der HTML-Datei, die die Tipps des Tages aufruft:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Tipp des Tages</title> </head> <body bgcolor="#BFBFBF" text="#000000" style="font-size:10pt;font-family:Arial" onload="dspltip()"> <div style="position:absolute;left:10;top:10;background-color:#808080;text-align:center;width:58;height:79%"><img src="totd.gif" width="23" height="31" border="0" style="position:relative;top:18" alt=""> <br> <span id="cntr" style="position:relative;top:140px;font-family:Arial;font-size:10pt;font-weight:bold;color:#FFFFF0"></span></div> <div style="position:absolute;left:68;top:10;background-color:#FFFFFF;width:346;height:79%;border:solid 1px #808080"><br> <font face="Times New Roman" size="+1"><b>Wussten Sie, dass ...</b></font> <hr size="1" style="position:relative;top:10"> <span id="mtxt" style="position:relative;top:10px;padding:15px 10px 10px 10px;font-family:Arial;font-size:10pt;width:100%;overflow:auto;height:138px"></span></div> <div style="position:absolute;left:10;top:222;width:100%"><input id="dspl1" type="checkbox" checked> <span onclick="chgstatus()">Tipps beim Start anzeigen</span><input type="button" value="Nächster Tipp" style="width:89;position:relative;left:61;background-color:#BFBFBF;color:#000000;font-family:Arial,sans-serif;font-size:9pt;border:2px outset #FFFFFF" onclick="ntip()"><input type="button" value="Schließen" style="width:75;position:relative;left:67;background-color:#BFBFBF;color:#000000;font-family:Arial,sans-serif;font-size:9pt;border:2px outset #FFFFFF" onclick="endf()"></div> <script type="text/javascript" src="totdmsg.js"> </script> <script type="text/javascript"> cnt=0; todmsg.sort(rndm) function rndm(a,b){ return (Math.random()-Math.random()) } function chgstatus(){ if (dspl1.checked) dspl1.checked=false; else dspl1.checked=true; } function dspltip(){ mtxt.innerHTML=todmsg[0] cntr.innerHTML="1/"+todmsg.length } function ntip(){ if (cnt<todmsg.length-1) cnt++; else cnt=0; mtxt.innerHTML=todmsg[cnt]; cntr.innerHTML=(cnt+1)+"/"+todmsg.length } function endf(){ if (!dspl1.checked) window.returnValue=1 else window.returnValue=0 window.close(); } </script> </body> </html>

Quelle: www.geocities.com/~lef Bitte beachten: Keine Haftung für Inhalte fremder Internetseiten .