wieso gehts nicht?


  • Taxel
  • 1174 Aufrufe 6 Antworten

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • wieso gehts nicht?

    hallo zusammen,
    ich habe folgende Seite:

    PHP-Quellcode

    1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    2. <html xmlns="http://www.w3.org/1999/xhtml">
    3. <head>
    4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    5. <title>Beispiel</title>
    7. <link href="format.css" rel="stylesheet" type="text/css" />
    8. <style type="text/css">
    9. div {
    10. position: absolute;
    11. cursor: pointer;
    12. }
    13. #info {
    14. top: 760px;
    15. left: 265px;
    16. width: 600px;
    17. height: 100px;
    18. }
    19. #person1 {
    20. top: 75px;
    21. left: 20px;
    22. width: 133px;
    23. height: 520px;
    24. z-index: 2;
    26. }
    28. #person2 {
    29. top: 117px;
    30. left: 319px;
    31. width: 69px;
    32. height: 432px;
    33. z-index: 2;
    34. }
    36. #person3 {
    37. top: 106px;
    38. left: 462px;
    39. width: 95px;
    40. height: 196px;
    41. z-index: 2;
    42. }
    44. <script language="JavaScript" type="text/javascript">
    46. var infotextperson1 = "Beschreibung zu person1";
    47. var infotextperson2 = "Beschreibung zu person2";
    48. var infotextperson3 = "Beschreibung zu person3";
    52. function beschreibung (eingabe) {
    53. switch (eingabe) {
    54. case "0": { document.getElementById("info").style.visibility = hidden; break;}
    55. default: { document.getElementById("info").innerHTML = infotext+info+; break;}}
    57. }
    59. </script>
    60. </head>
    62. <body bgcolor="#000033" onload="an("0")">
    64. <div id="bodydiv">
    65. <div id="person1" onmouseover="beschreibung(this.id)" onmouseout="beschreibung('0')">bild</div>
    66. <div id="person2" onmouseover="beschreibung(this.id)" onmouseout="beschreibung('0')">bild</div>
    67. <div id="person3" onmouseover="beschreibung(this.id)" onmouseout="an('0')">bild</div>
    68. <div id="info">Raum für den Inhalt von id "info"</div>
    69. </body>
    70. </html>
    Alles anzeigen

    hier soll im "info"-div, sobald man auf ein div mit nem bild der Person geht, eine Beschreibung zu dieser Person erscheinen

    das funktioniert aber nicht.

    wieso?


    hoffe auf Lösungen (vermutlich hab ich eh nur ein ; oder ein " oder so vergessen)
    Cuiusvis hominis est errare, nullius nisi insipientis in errore perseverare.
    Irren ist menschlich, doch im Irrtum zu verharren ist ein Zeichen von Dummheit.

    -Cicero

    Dieser Beitrag wurde bereits 2 mal editiert, zuletzt von Taxel ()

  • Hi,
    was mir beim lesen auffällt: Nach case/default kommen keine Klammern. Dazu dient break;

    Gruß
    Broken Sword

    edit: Was

    Quellcode

    1. infotext+"ein"+
    sein soll, weiß ich auch nicht.
    Auf dem Abstellgleis sah man ihn liegen,
    Auf dem Abstellgleis zwischen Schwelle und Gestein,
    Auf dem Abstellgleis im strömenden Regen,
    Auf dem Abstellgleis allein.

    Dieser Beitrag wurde bereits 3 mal editiert, zuletzt von Broken Sword ()

  • Also da sind ziemlich viele Fehler drin..
    </style> fehlt,
    onload="an("0")" ist besser zu ersetzen durch onload="an('0')"

    Was soll infotext+"ein"+ sein?

    Ausserdem ist da ja gar keine Funktion namens an() ...

    ich schau mir das gleich nochmal an
    ---------------
    EDIT: So, hab mal was gebastelt:

    HTML-Quellcode

    1. <script language="JavaScript" type="text/javascript">
    2. <!--
    4. infotext = new Array("Beschreibung zu person1", "Beschreibung zu person2", "Beschreibung zu person3");
    7. function beschreibung(eingabe) {
    9. if (eingabe == "null") {
    10. document.getElementById("info").style.visibility = 'hidden';
    11. }else{
    13. document.getElementById("info").innerHTML = infotext[eingabe];
    14. document.getElementById("info").style.visibility = 'visible';
    15. }
    17. }
    18. //-->
    19. </script>
    20. </head>
    22. <body bgcolor="#000033" onload="beschreibung('null');">
    24. <div id="bodydiv">
    25. <div id="person1" onmouseover="beschreibung('0')" onmouseout="beschreibung('null');">bild</div>
    26. <div id="person2" onmouseover="beschreibung('1')" onmouseout="beschreibung('null');">bild</div>
    27. <div id="person3" onmouseover="beschreibung('2')" onmouseout="beschreibung('null');">bild</div>
    28. <div id="info">Raum für den Inhalt von id "info"</div>
    29. </body>
    30. </html>
    Alles anzeigen


    Kann man natürlich noch etwas verbessern

    Dieser Beitrag wurde bereits 5 mal editiert, zuletzt von blackboX ()

  • danke für die vielen Fehlerfunde
    ein Teil is allerdings beim rausschneiden der anderen Sachen passiert, da ich ja nicht alle 20 personen und so draufhaben will
    jetz kopier ich hier trotzdem mal den ganzen Quelltext rein, denn was ich probier - das info-div bleibt leer

    PHP-Quellcode

    1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    2. <html xmlns="http://www.w3.org/1999/xhtml">
    3. <head>
    4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    5. <title>Website</title>
    7. <link href="format.css" rel="stylesheet" type="text/css" />
    8. <style type="text/css">
    9. div {
    10. position: absolute;
    11. cursor: pointer;
    12. }
    13. #info {
    14. top: 760px;
    15. left: 265px;
    16. width: 600px;
    17. height: 100px;
    18. }
    19. #alex {
    20. top: 75px;
    21. left: 20px;
    22. width: 133px;
    23. height: 520px;
    24. z-index: 2;
    26. }
    28. #tamara {
    29. top: 329px;
    30. left: 535px;
    31. width: 115px;
    32. height: 266px;
    33. z-index: 2;
    34. }
    35. #jo {
    36. top: 117px;
    37. left: 319px;
    38. width: 69px;
    39. height: 432px;
    40. z-index: 2;
    41. }
    42. #mone {
    43. top: 309px;
    44. left: 404px;
    45. width: 122px;
    46. height: 270px;
    47. z-index: 2;
    48. }
    49. #jule {
    50. top: 106px;
    51. left: 462px;
    52. width: 95px;
    53. height: 196px;
    54. z-index: 2;
    55. }
    56. #kathi {
    57. top: 89px;
    58. left: 563px;
    59. width: 97px;
    60. height: 234px;
    61. z-index: 2;
    62. }
    63. #kiki {
    64. top: 149px;
    65. left: 258px;
    66. width: 56px;
    67. height: 409px;
    68. z-index: 2;
    69. }
    70. #schaf {
    71. top: 138px;
    72. left: 395px;
    73. width: 62px;
    74. height: 162px;
    75. z-index: 2;
    76. }
    77. #gina {
    78. top: 89px;
    79. left: 160px;
    80. width: 92px;
    81. height: 488px;
    82. z-index: 2;
    83. }
    84. #marion {
    85. top: 126px;
    86. left: 665px;
    87. width: 112px;
    88. height: 458px;
    89. z-index: 2;
    90. }
    91. </style>
    92. <script language="JavaScript" type="text/javascript">
    93. var BildArray = new Array();
    95. BildArray[0] = "./Bilder/hintergrundbild_alex.jpg";
    96. BildArray[1] = "./Bilder/hintergrundbild_tamara.jpg";
    97. BildArray[2] = "./Bilder/hintergrundbild_jo.jpg";
    98. BildArray[3] = "./Bilder/hintergrundbild_mone.jpg";
    99. BildArray[4] = "./Bilder/hintergrundbild_jule.jpg";
    100. BildArray[5] = "./Bilder/hintergrundbild_kathi.jpg";
    101. BildArray[6] = "./Bilder/hintergrundbild_kiki.jpg";
    102. BildArray[7] = "./Bilder/hintergrundbild_schaf.jpg";
    103. BildArray[8] = "./Bilder/hintergrundbild_gina.jpg";
    104. BildArray[9] = "./Bilder/hintergrundbild_marion.jpg";
    106. function wechselHintergrund(id) {
    108. if(id) {
    110. document.getElementById("bodydiv").style.backgroundImage = 'url("./Bilder/hintergrundbild_'+id+'.jpg")';
    111. } else {
    113. document.getElementById("bodydiv").style.backgroundImage = 'url("./Bilder/hintergrundbild.jpg")';
    114. }
    115. }
    117. function oeffnePerson(name) {
    119. document.location.href = '/'+name+'.html';
    120. }
    123. function Vorladen02()
    124. {
    125. var i;
    126. for (i=0; i < BildArray.length; i++) {
    127. var Bild = new Image();
    128. Bild.src = BildArray[i];
    130. }
    131. }
    134. infotext = new Array("Beschreibung zu Alex", "Beschreibung zu Jo", "Beschreibung zu Jule", "Beschreibung zu Kathi", "Beschreibung zu Kiki", "Beschreibung zu Schaf", "Beschreibung zu Gina", "Beschreibung zu Marion", "Beschreibung zu Mone", "Beschreibung zu Tamara", );
    136. function beschreibung(eingabe) {
    138. if (eingabe == "null") {
    139. document.getElementById("info").style.visibility = 'hidden';
    140. }else{
    142. document.getElementById("info").innerHTML = infotext[eingabe];
    143. document.getElementById("info").style.visibility = 'visible';
    144. }
    146. }
    148. </script>
    149. </head>
    151. <body bgcolor="#000033" onload="Vorladen02();beschreibung('null');">
    154. <div class="oben"><img src="./Bilder/oben.jpg" alt="obere leiste" width="815" height="108" /></div>
    156. <div id="bodydiv">
    157. <div id="alex" onmouseover="wechselHintergrund(this.id);beschreibung('0');" onmouseout="wechselHintergrund();beschreibung('null')"></div>
    158. <div id="jo" onmouseover="wechselHintergrund(this.id);beschreibung('1');" onmouseout="wechselHintergrund();beschreibung('null')"></div>
    159. <div id="jule" onmouseover="wechselHintergrund(this.id);beschreibung('2');" onmouseout="wechselHintergrund();beschreibung('null')"></div>
    160. <div id="kathi" onmouseover="wechselHintergrund(this.id);beschreibung('3');" onmouseout="wechselHintergrund();beschreibung('null')"></div>
    161. <div id="kiki"onmouseover="wechselHintergrund(this.id);beschreibung('4');" onmouseout="wechselHintergrund();beschreibung('null')"></div>
    162. <div id="schaf" onmouseover="wechselHintergrund(this.id);beschreibung('5');" onmouseout="wechselHintergrund();beschreibung('null')"></div>
    163. <div id="gina"onmouseover="wechselHintergrund(this.id);beschreibung('6');" onmouseout="wechselHintergrund();beschreibung('null')"></div>
    164. <div id="marion" onmouseover="wechselHintergrund(this.id);beschreibung('7');" onmouseout="wechselHintergrund();beschreibung('null')"></div>
    165. <div id="mone" onmouseover="wechselHintergrund(this.id);beschreibung('8');" onmouseout="wechselHintergrund();beschreibung('null')"></div>
    166. <div id="tamara" onmouseover="wechselHintergrund(this.id);beschreibung('9');" onmouseout="wechselHintergrund();beschreibung('null')"></div>
    167. </div>
    169. <div id="info"></div>
    170. </body>
    171. </html>
    Alles anzeigen
    Cuiusvis hominis est errare, nullius nisi insipientis in errore perseverare.
    Irren ist menschlich, doch im Irrtum zu verharren ist ein Zeichen von Dummheit.

    -Cicero

    Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von Taxel () aus folgendem Grund: das menü schneid ich doch raus

  • Also ich appelliere an dich. Bring erstmal das Eine zum Laufen, bevor du dir noch mehr Code-Schnipsel holst. Das ist tödlich. Vor allem kommst du so nie weiter. Hast du dir schon einmal die Fehlermeldungen angesehen, die JS verursacht?
    Du hast ein überflüssiges Komma am Ende von deinem Array, darum wird jeder weitere Code nicht ausgeführt.

    Desweiteren bedeutet this.id die ID des Objektes, ergo "jo","jule" etc. Nicht 1, 2 ,3 oder 4, wie es in deiner Funktion aber verlangt wird. Musst du auch ändern.

    Gruß
    Broken Sword
    Auf dem Abstellgleis sah man ihn liegen,
    Auf dem Abstellgleis zwischen Schwelle und Gestein,
    Auf dem Abstellgleis im strömenden Regen,
    Auf dem Abstellgleis allein.

  • die Funktion wechsel hintergrund geht ja
    an die soll ja auch die jeweilige ID übergeben werden

    danke, das mitdem Komma wars
    Cuiusvis hominis est errare, nullius nisi insipientis in errore perseverare.
    Irren ist menschlich, doch im Irrtum zu verharren ist ein Zeichen von Dummheit.

    -Cicero

    Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von Broken Sword () aus folgendem Grund: Doppelpost =&gt; Regeln lesen!