Hier der Code der Index Datei
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta name="apple-mobile-web-app-capable" content="yes"/> <link rel="apple-touch-startup-image" href="/iphone/splash.png"/> <title>Hockey Frogs e.V.</title> <link rel="apple-touch-icon" href="/iphone/apple-touch-icon.png"/> <meta name="viewport" content="width=320; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/> <style type="text/css" media="screen">@import "iphonenav.css";</style> <s***** type="application/x-javas*****" src="iphonenav.js"></s*****> </head> <body> <h1 id="pageTitle"></h1> <a id="homeButton" class="button" href="#Home">Home</a> <a class="button" href="mailto:[email protected]?subject=WebApp-Kontaktformular">Kontakt</a> <ul id="Home" title="Hockey Frogs" selected="true"> <li><a href="#Das sind wir">Das sind wir</a></li> <li><a href="#Spielplan">Spielplan</a></li> <li><a href="#Ergebnisse">Ergebnisse</a></li> <li><a href="#Tabelle">Tabelle</a></li> </ul> <ul id="Das sind wir" title="Das sind wir"> <center> <p>Hallo und herzlich Willkommen auf der Seite der Cologne Hockey Frogs e.V.</p> <p>Wir sind ein Hobby Eishockeyverein in Köln-Troisdorf mit 3 Trainings- und 2 Spieleiszeiten pro Monat. Oberstes Gebot ist bei uns Fairplay und ein guter Umgang untereinander. Wer einmal dabei war, wird sofort merken, dass diese Stimmung uns von vielen andren Vereinen deutlich abhebt. Bei uns gibt es grundsätzlich drei Möglichkeiten mitzumachen:</p> <p>1)Vollmitgliedschaft: Diese Mitglieder des Vereins bestreiten sowohl die Trainings als auch die Spiele in der THL (Troisdorf Hockey Liga). Dieser Weg ist neuen Bewerbern derzeit nicht offen, da wir an der Kapazitätsgrenze für unser Team sind. Diese Mitgliedschaft kostet 45 EUR / Monat.</p> <p>2)Trainingsmitgliedschaft: Diese Mitglieder des Vereins nehmen nur an den Trainings teil. Dieser Weg steht grundsätzlich allen Bewerbern offen, die den Eishockeysport ausüben wollen. Anfänger und Profis sind willkommen. Diese Mitgliedschaft kostet 30 EUR / Monat. Derzeit ist auch hier extrem wenig Verfügbarkeit für Plätze. Der Vorstand entscheidet von Fall zu Fall, aber im Prinzip sind wir voll...</p> <p>3) Gast bei den Trainings: Gäste sind grundsätzlich immer willkommen. Allerdings müssen sich Trainingsgäste nun verbindlich anmelden und erhalten eine Zusage oder Absage vor dem Training, da wir die Zahl von 26 Feldspielern auf dem Eis während eines Trainings nicht überschreiten wollen. Ein Training kostet 15 EUR einmalig. Eines ist extrem wichtig: wir legen Wert darauf, dass sich unsere Gäste bei uns ordentlich benehmen und nicht den großen Macker raushängen lassen. Seien wir ehrlich: wir Hobbyspieler haben alle kein NHL Niveau und wenn einer meint er müsste durch blöde Sprüche oder Kommentare über das Niveau der Mitglieder auffallen, kann er gerne woanders trainieren. Bei uns soll's Spass machen!</p> <p>Die Art der Mitgliedschaft muss nach den Vereinsstatuten grundsätzlich vom Vorstand genehmigt werden.</p> <p>Falls Ihr Lust habt mitzumachen, meldet Euch unter [email protected]. Wir freuen uns, Euch kennenzulernen! </p> <p>Wir suchen ab sofort Gegner für Freundschaftsspiele bei uns in Troisdorf wo wir uns unter der Woche Abends eine Eiszeit teilen könnten. Meldet Euch unter [email protected].</p> <p>Ab sofort findet Ihr auf der Seite unseren Spielplan der Troisdorf Hobby Liga (THL) und die aktuellen Termine unserer Eiszeiten.</p> </center> </ul> <ul id="Spielplan" title="Spielplan"> <center> <p><strong>Heimspiele</strong></p> <table width="200" border="1"> <tr> <th scope="col">Datum</th> <th scope="col">Spielbeginn</th> <th scope="col">Gegner</th> </tr> <tr> <td>25.09.11</td> <td>09:45 Uhr</td> <td>Rheinteufel</td> </tr> <tr> <td>09.10.11</td> <td>09:45 Uhr</td> <td>Agressivos</td> </tr> <tr> <td>20.11.11</td> <td>09:45 Uhr</td> <td>Financials</td> </tr> <tr> <td>18.12.11</td> <td>09:45 Uhr</td> <td>Bandits</td> </tr> <tr> <td>08.01.11</td> <td>09:45 Uhr</td> <td>Ro.Stern</td> </tr> <tr> <td>29.01.11</td> <td>09:45 Uhr</td> <td>Shooters</td> </tr> <tr> <td>26.02.11</td> <td>09:45 Uhr</td> <td>Silberrücken</td> </tr> </table> <p> </p> <p><strong>Auswärtsspiele</strong></p> <table width="200" border="1"> <tr> <th scope="col">Datum</th> <th scope="col">Spielbeginn</th> <th scope="col">Ort</th> <th scope="col">Gegner</th> </tr> <tr> <td>27.10.11</td> <td>22:15 Uhr</td> <td>TRO</td> <td>Ro.Stern</td> </tr> <tr> <td>04.12.11</td> <td>20:30 Uhr</td> <td>TRO</td> <td>Silberrücken</td> </tr> <tr> <td>14.12.11</td> <td>21:45 Uhr</td> <td>KA2</td> <td>Agressivos</td> </tr> <tr> <td>05.02.12</td> <td>10:00 Uhr</td> <td>KA2</td> <td>Rheinteufel</td> </tr> <tr> <td>11.02.12</td> <td>08:00 Uhr</td> <td>TRO</td> <td>Bandits</td> </tr> <tr> <td>03.03.12</td> <td>12:45 Uhr</td> <td>TRO</td> <td>Financials</td> </tr> <tr> <td>29.03.12</td> <td>20:45 Uhr</td> <td>BEN</td> <td>Shooters</td> </tr> </table> </center> </ul> <ul id="Ergebnisse" title="Ergebnisse"> <center> <body><table width="200" border="1"> <tr> <th scope="col">Datum</th> <th scope="col">Heim</th> <th scope="col">Auswärts</th> <th scope="col">Ergebnis</th> </tr> <tr> <td>25.09.11</td> <td>Frogs</td> <td>Rheinteufel</td> <td>5:1</td> </tr> <tr> <td>09.10.11</td> <td>Frogs</td> <td>Agressivos</td> <td>2:8</td> </tr> <tr> <td>27.10.11</td> <td>Ro.Stern</td> <td>Frogs</td> <td>2:7</td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> </tr> </table> </center> </ul> <ul id="Tabelle" title="Tabelle"> <CENTER> <TABLE BGCOLOR=#FFFFFF CELLSPACING=0 CELLPADDING=0 BORDER=1><TR><TD> <TABLE CELLSPACING=0 CELLPADDING=1 BORDER=0 WIDTH=100%><TR><TD> <TR BGCOLOR=#EEEEEE> <TD COLSPAN=2><B>Tabelle</B></TD> <TD ALIGN=RIGHT><B> Sp.</B></TD> <TD ALIGN=RIGHT><B> s</B></TD> <TD ALIGN=RIGHT><B> u</B></TD> <TD ALIGN=RIGHT><B> n</B></TD> <TD ALIGN=RIGHT><B> Pkt.</B></TD> <TD ALIGN=CENTER COLSPAN=3><B> Tore </B></TD> <TD ALIGN=RIGHT><B>Diff.</B></TD> </TR> <TR BGCOLOR="#BBFFFF"> <TD ALIGN=RIGHT><B>1 </B></TD> <TD>Agressivos</TD> <TD ALIGN=RIGHT>2</TD> <TD ALIGN=RIGHT>2</TD> <TD ALIGN=RIGHT>0</TD> <TD ALIGN=RIGHT>0</TD> <TD ALIGN=RIGHT><B>6</B></TD> <TD ALIGN=RIGHT>16</TD> <TD ALIGN=CENTER>:</TD> <TD>4</TD> <TD ALIGN=RIGHT>12</TD> </TR> <TR BGCOLOR="#FFFFFF"> <TD ALIGN=RIGHT><strong>2 </strong></TD> <TD><strong>Frogs</strong></TD> <TD ALIGN=RIGHT><strong>3</strong></TD> <TD ALIGN=RIGHT><strong>2</strong></TD> <TD ALIGN=RIGHT><strong>0</strong></TD> <TD ALIGN=RIGHT><strong>1</strong></TD> <TD ALIGN=RIGHT><strong>6</strong></TD> <TD ALIGN=RIGHT><strong>14</strong></TD> <TD ALIGN=CENTER><strong>:</strong></TD> <TD><strong>11</strong></TD> <TD ALIGN=RIGHT><strong>3</strong></TD> </TR> <TR BGCOLOR="#FFFFFF"> <TD ALIGN=RIGHT><B>3 </B></TD> <TD>Silberrücken</TD> <TD ALIGN=RIGHT>1</TD> <TD ALIGN=RIGHT>1</TD> <TD ALIGN=RIGHT>0</TD> <TD ALIGN=RIGHT>0</TD> <TD ALIGN=RIGHT><B>3</B></TD> <TD ALIGN=RIGHT>8</TD> <TD ALIGN=CENTER>:</TD> <TD>0</TD> <TD ALIGN=RIGHT>8</TD> </TR> <TR BGCOLOR="#FFFFFF"> <TD ALIGN=RIGHT><B>4 </B></TD> <TD>Shooters</TD> <TD ALIGN=RIGHT>1</TD> <TD ALIGN=RIGHT>1</TD> <TD ALIGN=RIGHT>0</TD> <TD ALIGN=RIGHT>0</TD> <TD ALIGN=RIGHT><B>3</B></TD> <TD ALIGN=RIGHT>5</TD> <TD ALIGN=CENTER>:</TD> <TD>2</TD> <TD ALIGN=RIGHT>3</TD> </TR> <TR BGCOLOR="#FFFFFF"> <TD ALIGN=RIGHT><B>5 </B></TD> <TD>Rheinteufel</TD> <TD ALIGN=RIGHT>2</TD> <TD ALIGN=RIGHT>1</TD> <TD ALIGN=RIGHT>0</TD> <TD ALIGN=RIGHT>1</TD> <TD ALIGN=RIGHT><B>3</B></TD> <TD ALIGN=RIGHT>5</TD> <TD ALIGN=CENTER>:</TD> <TD>8</TD> <TD ALIGN=RIGHT>-3</TD> </TR> <TR BGCOLOR="#FFFFFF"> <TD ALIGN=RIGHT><B>6 </B></TD> <TD>Roter Stern</TD> <TD ALIGN=RIGHT>1</TD> <TD ALIGN=RIGHT>0</TD> <TD ALIGN=RIGHT>0</TD> <TD ALIGN=RIGHT>1</TD> <TD ALIGN=RIGHT><B>0</B></TD> <TD ALIGN=RIGHT>2</TD> <TD ALIGN=CENTER>:</TD> <TD>7</TD> <TD ALIGN=RIGHT>-5</TD> </TR> <TR BGCOLOR="#FFFFFF"> <TD ALIGN=RIGHT><B>7 </B></TD> <TD>Financials</TD> <TD ALIGN=RIGHT>2</TD> <TD ALIGN=RIGHT>0</TD> <TD ALIGN=RIGHT>0</TD> <TD ALIGN=RIGHT>2</TD> <TD ALIGN=RIGHT><B>0</B></TD> <TD ALIGN=RIGHT>5</TD> <TD ALIGN=CENTER>:</TD> <TD>12</TD> <TD ALIGN=RIGHT>-7</TD> </TR> <TR BGCOLOR="#FFFFFF"> <TD ALIGN=RIGHT><B>8 </B></TD> <TD>Bandits</TD> <TD ALIGN=RIGHT>2</TD> <TD ALIGN=RIGHT>0</TD> <TD ALIGN=RIGHT>0</TD> <TD ALIGN=RIGHT>2</TD> <TD ALIGN=RIGHT><B>0</B></TD> <TD ALIGN=RIGHT>2</TD> <TD ALIGN=CENTER>:</TD> <TD>13</TD> <TD ALIGN=RIGHT>-11</TD> </TR> </TABLE> </TD></TR></TABLE> </CENTER> </ul> <div id="footer">iPhone site powered by M.XXX</div> </body> </html>
und hier der, der iphonenav.css
Code:
body { margin: 0; font-family: Helvetica; background: #FFFFFF; color: #000000; overflow: hidden; -webkit-text-size-adjust: none; } body > h1 { box-sizing: border-box; margin: 0; padding: 10px; line-height: 20px; font-size: 20px; font-weight: bold; text-align: center; text-shadow: rgba(0, 0, 0, 0.6) 0px -1px 0; text-overflow: ellipsis; color: #FFFFFF; background: url(iPhoneToolbar.png) #6d84a2 repeat-x; border-bottom: 1px solid #2d3642; } .button { position: absolute; top: 9px; right: 6px; -webkit-border-image: url(iPhoneButton.png) 0 5 0 5; -webkit-border-radius: 0; border-width: 0 5px 0 5px; padding: 0; height: 28px; line-height: 28px; font-size: 12px; font-weight: bold; color: #FFFFFF; text-shadow: rgba(0, 0, 0, 0.6) 0px -1px 0; text-decoration: none; background: none; } #homeButton { display: none; left: 6px; right: auto; -webkit-border-image: url(iPhoneBackButton.png) 0 8 0 14; border-width: 0 8px 0 14px; } .goButton { -webkit-border-image: url(iPhoneGoButton.png) 0 5 0 5; border-width: 0 5px; } body > div, body > form, body > ul { display: none; position: absolute; left: 0; top: 41px; width: 100%; min-height: 418px; margin: 0; padding: 0; } body > *[selected="true"] { display: block; } body > ul > li { margin: 0; border-bottom: 1px solid #E0E0E0; padding: 0; background: url(iPhoneArrow.png) no-repeat right center; font-size: 20px; font-weight: bold; list-style: none; } body > ul > li > a { display: block; padding: 8px 32px 8px 8px; text-decoration: none; color: inherit; } .panel { box-sizing: border-box; padding: 10px; background: #c8c8c8 url(pinstripes.png); } /************************************************************************************************/ .dialog { position: absolute; top: 0; width: 100%; min-height: 468px; z-index: 2; background: rgba(0, 0, 0, 0.8); padding: 0; text-align: right; } fieldset { box-sizing: border-box; width: 100%; margin: 0; border: none; padding: 10px 6px; background: url(iPhoneToolbar.png) #7388a5 repeat-x; } fieldset > h1 { margin: 0 10px 0 10px; padding: 0; font-size: 20px; font-weight: bold; color: #FFFFFF; text-shadow: rgba(0, 0, 0, 0.6) 0px -1px 0; text-align: center; } label { position: absolute; margin: 14px 0 0 6px; font-size: 14px; color: #BBBBBB; } input { box-sizing: border-box; width: 100%; margin: 6px 0 0 0; padding: 6px 6px 6px 44px; font-size: 16px; font-weight: normal; } table.DataTable { color : black; background : #fff; border : 1px solid #B4B4B4; font : bold 17px Helvetica; padding : 0; color : #666; border-collapse : collapse; margin : 15px 10px 17px 10px; vertical-align : middle; text-align : center; -webkit-border-radius : 8px; width : 80%; } table.DataTable td { padding: 10px 8px 8px 10px; } table.DataTable th { color: black; padding: 10px 8px 8px 10px; } #footer { text-align: center; position: relative; margin: 20px 10px 0; height: auto; width: auto; bottom: 10px; }