Anzeige

Overlay mit JavaScript anzeigen lassen funktioniert nicht

Overlay mit JavaScript anzeigen lassen funktioniert nicht | PSD-Tutorials.de

Erstellt von SWFP, 17.08.2013.

  1. SWFP

    SWFP SWFP Mitglied

    Dabei seit:
    29.04.2011
    Beiträge:
    279
    Geschlecht:
    männlich
    Software:
    EDIUS, Phase 5 html Editor, Notepad++, MAGIX Video deluxe
    Kameratyp:
    JVC Enverio
    Overlay mit JavaScript anzeigen lassen funktioniert nicht
    Hi,
    ich wollte ein Overlay via JavaScript erscheinen lassen.
    Code (Text):
    1. ...<li><a href="index.php?item=ski">Skisprung-Ecke</a></li>...
    Code (Text):
    1. <?php
    2. $_GET['item'] = $item;
    3.  
    4. switch ($item) {
    5.     case 'ski':
    6.         echo "<div class=\"overlay\" onclick=\"getElementById('overlay').style.display='none'; getElementById('fenster').style.display='none';\"><div class=\"fenster\"><h1>Skisprung-Ecke</h1></div></div>";
    7.         break;
    8.     case '':
    9.         echo '';
    10.         break;
    11.     default:
    12.         echo '';
    13. }
    14. ?>
    Doch nichts passiert.
    Wo liegt mein Fehler?

    MfG
    SWFP
     
    #1      
  2. Duddle

    Duddle Posting-Frequenz: 14µHz

    Dabei seit:
    03.02.2006
    Beiträge:
    3.864
    Geschlecht:
    männlich
    Ort:
    Dresden
    Overlay mit JavaScript anzeigen lassen funktioniert nicht
    AW: Overlay mit JavaScript anzeigen lassen funktioniert nicht

    Du sagst nirgendwo, dass du etwas erscheinen lassen willst. In beiden JavaScript-Anweisungen versteckst du ein Element.


    Duddle
     
    #2      
  3. SWFP

    SWFP SWFP Mitglied

    Dabei seit:
    29.04.2011
    Beiträge:
    279
    Geschlecht:
    männlich
    Software:
    EDIUS, Phase 5 html Editor, Notepad++, MAGIX Video deluxe
    Kameratyp:
    JVC Enverio
    Overlay mit JavaScript anzeigen lassen funktioniert nicht
    AW: Overlay mit JavaScript anzeigen lassen funktioniert nicht

    Oh, stimmt. Aber auch so

    PHP:
    1.  
    2. <?php
    3. $_GET['item'] = $item;
    4.  
    5. switch ($item) {
    6.     case 'ski':
    7.         echo "<div class=\"overlay\" onclick=\"getElementById('overlay').style.display='block'; getElementById('fenster').style.display='block';\"><div class=\"fenster\"><h1>Skisprung-Ecke</h1></div></div>";
    8.         break;
    9.     case '':
    10.         echo '';
    11.         break;
    12.     default:
    13.         echo '';
    14. }
    15. ?>
    passiert nichts

    SWFP
     
    #3      
  4. Duddle

    Duddle Posting-Frequenz: 14µHz

    Dabei seit:
    03.02.2006
    Beiträge:
    3.864
    Geschlecht:
    männlich
    Ort:
    Dresden
    Overlay mit JavaScript anzeigen lassen funktioniert nicht
    AW: Overlay mit JavaScript anzeigen lassen funktioniert nicht

    Du solltest dringend Debugging lernen. Auch in Bezug auf deine anderen Threads, die gerade parallel laufen.
    Wenn etwas "nicht funktioniert", musst du das Problem eben eingrenzen, bis du es gefunden hast. Voraussetzung dafür aber ist, dass du halbwegs verstehst, wie die Komponenten miteinander arbeiten.

    Im konkreten Fall ist dein Problem ein JavaScript-Problem, das steht ja sogar im Titel des Threads. Warum schaust du also im PHP-Code?

    Das erzeugte HTML muss der erste Ansatzpunkt sein. Wenn das korrekt ist, muss das CSS der nächste Schritt sein. Erst wenn du manuell mit CSS das Overlay korrekt anzeigen lassen kannst, kannst du es dynamisch machen. Erst dann kommt JavaScript in's Spiel. Wenn du dann mit statischem Code das Overlay wie erwartet steuern kannst, erst dann machst du es dynamisch mit PHP.
    Du gehst von der falschen Seite an das Problem heran.


    Duddle
     
    #4      
  5. SWFP

    SWFP SWFP Mitglied

    Dabei seit:
    29.04.2011
    Beiträge:
    279
    Geschlecht:
    männlich
    Software:
    EDIUS, Phase 5 html Editor, Notepad++, MAGIX Video deluxe
    Kameratyp:
    JVC Enverio
    Overlay mit JavaScript anzeigen lassen funktioniert nicht
    AW: Overlay mit JavaScript anzeigen lassen funktioniert nicht

    Okay. Dank. So habe ich das noch nie betrachtet und das hat mir auch noch niemand erklärt. Also zuerst mal das HTMl scheint okay zu sein. Auch das CSS. Ich frag trotzdem nochmal:
    Code (Text):
    1.  
    2. .overlay {
    3. background-color: black;
    4. opacity: 0.6;
    5. z-index: 100;
    6. padding: 80px;
    7. width: 100%;
    8. height: 100%;
    9. margin-left: -80px;
    10. margin-top: -500px;
    11. margin-bottom: -100px;
    12. }
    13.  
    14. .overlay:target {
    15.   width: 100%;
    16.   height: 100%;
    17.   opacity: 1;
    18. }
    19.  
    20. .fenster {
    21. padding: 10px 20px;
    22. background-color: white;
    23. border-radius: 10px;
    24. -moz-border-radius: 10px;
    25. -webkit-border-radius: 10px;
    26. margin-bottom: 10px;
    27. z-index: 200;
    28. align: middle;
    29. margin: 100px;
    30. position: absolute;
    31. top: 200px;
    32. left: 200px;
    33. width: 50%;
    34. height: 50%;
    35. box-shadow: 10px;
    36. -webkit-box-shadow: 10px 10px 10px;
    37. -moz-box-shadow: 10px 10px 10px;
    38. }
    39.  
    SWFP
     
    #5      
  6. Duddle

    Duddle Posting-Frequenz: 14µHz

    Dabei seit:
    03.02.2006
    Beiträge:
    3.864
    Geschlecht:
    männlich
    Ort:
    Dresden
    Overlay mit JavaScript anzeigen lassen funktioniert nicht
    AW: Overlay mit JavaScript anzeigen lassen funktioniert nicht

    Ohne HTML hat das CSS keine Aussagekraft. Ein Automechaniker kann dir auch nicht alleine anhand des Zündkolbens sagen, warum dein Motor nicht startet.

    Ich betone nochmal: es gibt keine magische Glaskugel, die mir (oder irgendjemandem) verrrät, wie dein Code, der Kontext, deine Umgebung aussehen.

    Ausserdem will ich drauf hinweisen, dass du daran arbeiten solltest, den eingesetzten Code auch zu verstehen. Bitte lies das nicht als persönlichen Angriff, aber ich behaupte du hast dir das Overlay aus irgendeinem Tutorial o.ä. zusammenkopiert.
    Ohne aber genau zu verstehen, warum dort Anweisung xyz steht und welchen Einfluss sie auf das Verhalten des CSS hat, oder wie du CSS-Fehler aufspüren kannst, wirst du immer anecken. Diese Aussage lässt sich 1:1 auf HTML, JS, PHP usw. übertragen.


    Duddle
     
    #6      
  7. SWFP

    SWFP SWFP Mitglied

    Dabei seit:
    29.04.2011
    Beiträge:
    279
    Geschlecht:
    männlich
    Software:
    EDIUS, Phase 5 html Editor, Notepad++, MAGIX Video deluxe
    Kameratyp:
    JVC Enverio
    Overlay mit JavaScript anzeigen lassen funktioniert nicht
    AW: Overlay mit JavaScript anzeigen lassen funktioniert nicht

    Das HTML entspricht in diesem Fall dem PHP.

    Nein, ich sehe das nicht als persönlichen Angriff, aber ich stelle meine Fragen natürlich aus einem bestimmten Grund.

    Ich will meine Situation mal so erklären und ich hoffe du verstehst mich:
    Ich habe mir fast alles, was ich übers Webdesign weiß, selbst beigebracht, d.h. aus verschiedensten Quellen. Das heißt auch, dass ich beim Problemlösen immer so weit versuche, wie ich eben komme, und mir dann ein Tutorial ansehe. Das heißt auch, dass ich verschiedene Dinge nicht weiß, weil sie mir leider keiner gesagt hat. Und das heißt auch, dass ich verschiedene Dinge erst noch lernen muss, aber versuche, das bestmöglich zu tun. ich hoffe, das ist so gut erklärt.

    SWFP
     
    #7      
  8. Duddle

    Duddle Posting-Frequenz: 14µHz

    Dabei seit:
    03.02.2006
    Beiträge:
    3.864
    Geschlecht:
    männlich
    Ort:
    Dresden
    Overlay mit JavaScript anzeigen lassen funktioniert nicht
    AW: Overlay mit JavaScript anzeigen lassen funktioniert nicht

    [OffTopic]
    Wenn ich eines hoch schätze, dann ist es Eigeninitiative, besonders wenn es um das Lernen neuer Dinge geht. Deshalb helfe ich auch so gern im Forum aus.
    [/OffTopic]

    Bitte mach weiter, aber arbeite dabei auch an den allgemeinen Fähigkeiten eines Entwicklers.
    Du musst vorallendingen Debugging lernen. Das fängt bei Zwischenausgaben zum Nachvollziehen des aktuellen Status der Anwendung/Seite an und geht zu den üblichen Werkzeuge (FireBug oder vergleichbares).

    Immer wenn du dir in Zukunft sagst "das funktioniert nicht", geh Zeile für Zeile drüber und lass dir ausgeben was zwischendurch passiert. So findest du i.d.R. die Quelle des Problems.
    Wenn du dann den Fehler nicht sofort siehst, schau ob du vielleicht in die Funktion / den Teilcode tauchen musst, um die Ursache zu finden. Stell dir dabei vor, du sprichst zu einem Quietscheentchen und erkläre ihr, was jede Zeile macht.

    Falls es dann immer noch nicht klickt, poste im Forum. Aber schreib nicht einfach "es funktioniert nicht", sondern gib die relevanten Zwischenausgaben mit an, was du schon getestet hast, usw. Das hat deutlich mehr Aussagekraft.

    Ideal ist es dabei, alles notwendige direkt zu posten (notfalls anonymisiert), dann kann jemand wie ich das Projekt lokal nachbauen und auf Fehlersuche gehen.

    Für ganz üble Fälle kannst du mich auch direkt in ICQ #86198212 anschreiben.

    Auch musst du erkennen, was an einem Problem teilhaben könnte. Dieser Thread ist ein gutes Beispiel dafür: ja natürlich erzeugt dein PHP einen Teil des HTMLs, aber doch nicht alles.
    Der Kontext könnte wichtig sein, poste also lieber zu viel als zu wenig. Auch könnte anderes JavaScript die Sache beeinträchtigen, also musst du das notwendigerweise auch zeigen (falls da mehr ist).


    Duddle
     
    Zuletzt bearbeitet: 18.08.2013
    #8      
  9. SWFP

    SWFP SWFP Mitglied

    Dabei seit:
    29.04.2011
    Beiträge:
    279
    Geschlecht:
    männlich
    Software:
    EDIUS, Phase 5 html Editor, Notepad++, MAGIX Video deluxe
    Kameratyp:
    JVC Enverio
    Overlay mit JavaScript anzeigen lassen funktioniert nicht
    AW: Overlay mit JavaScript anzeigen lassen funktioniert nicht

    Okay. Vielen Dank. ich versuche mein Bestes. Aber ich kann natürlich nicht versprechen, dass sofort alles besser läuft. Allerdings würde ich mich bis dahin immer wieder über Feedbacks freuen, die mich meinem Ziel näher bringen.
     
    #9      
Seobility SEO Tool
x
×
×