Ok, dann fangen wir mal mit dem dazugehörigen Style-Sheet (ja, ihr werdet sie immer wieder brauchen) an. Folgende Dinge MÜSSEN da definiert sein:
.tooltiptitle{COLOR: #203E56; TEXT-DECORATION: none; HAND: Default; font-family: arial; font-weight: bold; font-size: 7pt} .tooltipcontent{COLOR:#5B89AB; TEXT-DECORATION: none; HAND: Default; font-family: arial; font-size: 7pt} #ToolTip{position:absolute; width: 100px; top: 0px; left: 0px; z-index:4; visibility:hidden;} table,tr,td {color: #5B89AB; font-size: 12px; font-weight: regular; text-decoration: none; font-family: verdana; text-align: lest;}
Meine Angaben könnt ihr natürlich so ändern, dass sie eurem Layout entsprechen. Damit bestimmt ihr wie diese putzigen Balken aussehen die beim mouse-over eines Termins erscheinen. Da der Kalender in Tabellen aufgeteilst ist sollten auch die in eurem Style-Sheet drin sein, damit ihr keine wilden Balken und Hintergründe habt.
Jetzt der Code für den eigentlichen Kalender:

<body onmousemove="overhere()"> <script type="text/javascript" language="javascript">  </script> <div id="ToolTip"></div> K A L E N D A R <table border="0" style="border: 1pt dashed #5B89AB" cellpadding="1" cellspacing="0" width="124"> <tr> <td align="center" colspan="7" width="128"> Oktober 2003 <tr> <td width="13"> M </td> <td width="19"> D </td> <td width="17"> M </td> <td width="17"> D </td> <td width="17"> F </td> <td width="18"> S </td> <td width="15"> S </td> </tr> <tr> <td width="13" align="center"> <td width="19" align="center"> <td width="17" align="center">1 <td width="17" align="center">2 <td width="17" align="center">3 <td width="18" align="center">4 <td width="15" align="center">5 </tr> <tr> <td width="13" align="center">6 <td width="19" align="center">7 <td width="17" align="center">8 <td width="17" align="center">9 <td width="17" align="center">10 <td width="18" align="center">11 <td width="15" align="center">12 </tr> <tr> <td width="13" align="center">13 <td width="19" align="center">14 <td width="17" align="center">15 <td width="17" align="center">16 <td width="17" align="center"><a href onMouseover="EnterContent('ToolTip','10/17','Christina live!'); Activate();"onMouseout="deActivate()">17</a> <td width="18" align="center">18 <td width="15" align="center"><a href onMouseover="EnterContent('ToolTip','10/19','auch was vor?'); Activate();"onMouseout="deActivate()">19</a> </tr> <tr> <td width="13" align="center">20 <td width="19" align="center">21 <td width="17" align="center">22 <td width="17" align="center">23 <td width="17" align="center">24 <td width="18" align="center">25 <td width="15" align="center">26 </tr> <tr> <td width="13" align="center"><a href onMouseover="EnterContent('ToolTip','10/27','FERIEN!!*'); Activate();"onMouseout="deActivate()">27</a> <td width="19" align="center">28 <td width="17" align="center">29 <td width="17" align="center">30 <td width="17" align="center">31 <td width="18" align="center"> <td width="15" align="center"> </tr> <tr> <td width="13" align="center"> <td width="19" align="center"> <td width="17" align="center"> <td width="17" align="center"> <td width="17" align="center"> <td width="18" align="center"> <td width="15" align="center"> </tr> </center> </tr> </table> </td>

Wenn ihr euch diesen Code jetzt anseht solltet ihr sehen wie und an welcher Stelle ich die Termine (z.B. am 27. den Punkt "Ferien") eingefügt habe. Ihr verfahrt nach dem gleichen Schema um eure Daten einzutragen. Wichtig, schaut vorher ob die Einteilung des Kalenders noch stimmt, sprich, wenn ihr den Kalender für Dezember wollt stimmt die Zuteilung von Wochentagen zum jeweiligen Datum so nicht mehr, vorher ändern, dann Termine eintragen!
So, wenn ihr jetzt noch fragen dazu habt einfach mailen.

ein Kalender - oder "huch wie die Zeit rennt"...

Wolltet ihr auf eurer Seite immer schon mal so einen WAHNSINNIG STYLISCHEN Kalender haben damit alle sehen wie furchtbar viel ihr zu tun habt? Sollte der ungefähr so aussehen?

K A L E N D A R

Oktober 2003
M	D	M	D	F	S	S
		1	2	3	4	5
6	7	8	9	10	11	12
13	14	15	16	17	18	19
20	21	22	23	24	25	26
27	28	29	30	31