Getorix: Anfängerin, die nicht weiss, wie man das <noscript> plaziert

Hallo zusammen,

ich hab mich bereits am 13.02 hier mit einer Frage gemeldet, die sehr zuvorkommend beantwortet wurde, danke vielmals.

jetzt bin ich dran, die Tipps von damals umzusetzen und eigne mir deshalb Javascript Grundlagen an. Und es klappt soweit :).

Ich versuche mich nun an einer Bildwechselaufgabe. Ich trau mich fast nicht, euch etwas so banales zu fragen, aber ich schaffe es irgendwie grad nicht herauszufinden, wo genau das <noscript> sinnvollerweise hingehört. Das Bild soll sich in einem neuen Tab öffnen, wenn JavaScript inaktiv ist.

jetzige "Lösung"
<a href="#giersch" onclick="document.giersch.src='wildkrautbilder/giersch03.jpg'; document.giersch.width='800'; document.giersch.height='533'; "><noscript><a href="wildkrautbilder/giersch03.jpg" target="_blank"></noscript><img src="vswildkrautbilder/vsgiersch03.jpg" width="200" height="133" alt=""></img></a>

URL: http://www.kaninchen-info.de/javascript_bild.html

Vielen Dank und liebe Grüsse
Lina

  1. Hi,

    Ich versuche mich nun an einer Bildwechselaufgabe. Ich trau mich fast nicht, euch etwas so banales zu fragen, aber ich schaffe es irgendwie grad nicht herauszufinden, wo genau das <noscript> sinnvollerweise hingehört. Das Bild soll sich in einem neuen Tab öffnen, wenn JavaScript inaktiv ist.

    Dazu braucht es überhaupt kein Noscript, sondern nur eine Verlinkung auf das Bild - und return false aus dem Eventhandler-Attribut heraus, um die Default-Aktion des Links zu unterdrücken.

    <a href="bild.jpg" onclick="...; return false;">...</a>

    MfG ChrisB

    --
    RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
    1. *patsch* da kann ich natürlich noch lange nach <noscript> suchen... .

      Vielen Dank für die Antwort und einen schönen Abend
      Lina

      1. nochmals ich:

        hab das ganze mal vom Validator.w3 anschauen lassen und verstehe nicht, was der mir mitteilen will:

        Was mache ich falsch?

        Liebe Grüsse
        Lina

        Output (validator.w3.org)
        ----------
        Validation Output: 6 Errors

        1. Error Line 75, Column 80: attributes construct error

        …giersch03.jpg" onclick=" document.giersch.src='wildkrautbilder/giersch03.jpg';…
        ----------
           2. Error Line 75, Column 80: Couldn't find end of Start Tag a line 75

        …giersch03.jpg" onclick=" document.giersch.src='wildkrautbilder/giersch03.jpg';…
        ----------
           3. Error Line 75, Column 80: Opening and ending tag mismatch: div line 61 and a

        …giersch03.jpg" onclick=" document.giersch.src='wildkrautbilder/giersch03.jpg';…

        ----------
           4. Error Line 126, Column 6: Opening and ending tag mismatch: body line 22 and div

        </div> <!-- Ende Container -->

        ----------
           5. Error Line 127, Column 7: Opening and ending tag mismatch: html line 3 and body

        </body>

        ----------
           6. Error Line 128: Extra content at the end of the document

        </html>

        1. Hi,

          hab das ganze mal vom Validator.w3 anschauen lassen und verstehe nicht, was der mir mitteilen will:
          Was mache ich falsch?

          Die verlinkte Seite aus dem ersten Posting zeigt beim Validieren keine Fehler.
          Wenn Deine lokale Seite den Fehler zeigt, dann hast Du was verändert - aber wir können nicht sehen, was.

          Output (validator.w3.org)

          Validation Output: 6 Errors

          1. Error Line 75, Column 80: attributes construct error

          …giersch03.jpg" onclick=" document.giersch.src='wildkrautbilder/giersch03.jpg';…

          Das dürfte der eigentliche Fehler sein, der Rest sind dann nur noch Folgefehler.

          Aber um zu beurteilen, was da falsch ist, müßte man den fehlerauslösenden Quelltext kennen ...

          cu,
          Andreas

          --
          Warum nennt sich Andreas hier MudGuard?
          O o ostern ...
          Fachfragen per Mail sind frech, werden ignoriert. Das Forum existiert.
  2. Liebe Lina,

    Du entwickelst mit dem Internet Explorer. Das ist potenziell hochproblematisch! Du setzt z.B. Dinge voraus, die nur in diesem Browser (und vielleicht Opera) so funktionieren.

    document.giersch.src='wildkrautbilder/giersch03.jpg';

    Im IE werden Elemente, die eine ID tragen zu Eigenschaften des document-Objektes. Ich kann im IE also
    <p id="Unsinn">Blah blubb!</p> als document.Unsinn ansprechen.
    Wie gesagt, im IE... Aber was machen andere Browser damit? Sie geben in ihrer Fehlerkonsole eine entsprechende Meldung zu einem Fehler aus - und Deine Funktionalität ist weg.

    Mein Tipp: Wenn Du mit JavaScript arbeiten willst, dann nimm einen sinnvollen Browser zum Entwickeln. Zwar kann der IE8 inzwischen vieles besser, aber aus Gründen der Kompatibilität zu seinen Vorgängern macht er notgedrungen noch immer viel Mist. Meine Wahl ist daher noch immer der Firefox zusammen mit der Firebug-Erweiterung.

    Zu Deiner Frage mit <noscript>: Im Wiki steht noch nicht genügend dazu, daher bedienen wir uns der bisherigen Dokumentation, klicken auf Syntaxverzeichnis, dort auf den Bereich HTML/XHTML, wählen dort den Buchstaben N aus und finden letzten Endes den Eintrag zu noscript.

    Dort kann man dann sehen, dass Deine Art des JavaScript-Schreibens sich auf Eventhandler-Attribute wie z.B. "onclick" beschränkt, innerhalb derer dieses Element nicht stehen kann, weil es eben ein Element und kein Attribut ist.

    Wenn Du mehr dazu lesen willst, wie man JavaScripte sinnvoll aufbaut, dann empfehle ich Dir den Artikel für Fortgeschrittene: Fader-Framework - kleiner Lehrgang zum vernünftigen Schreiben eines JavaScripts

    Liebe Grüße,

    Felix Riesterer.

    --
    ie:% br:> fl:| va:) ls:[ fo:) rl:| n4:? de:> ss:| ch:? js:) mo:} zu:)
    1. Hi,

      Du setzt z.B. Dinge voraus, die nur in diesem Browser (und vielleicht Opera) so funktionieren.

      Das stimmt in Bezug auf das hier:

      document.giersch.src='wildkrautbilder/giersch03.jpg';

      nicht. Siehe http://de.selfhtml.org/javascript/objekte/images.htm#allgemeines

      MfG ChrisB

      --
      RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
      1. Lieber ChrisB,

        document.giersch.src='wildkrautbilder/giersch03.jpg';

        Siehe http://de.selfhtml.org/javascript/objekte/images.htm#allgemeines

        Du hast - wie immer - natürlich Recht. Aber was passiert, wenn die Bilder keinen Namen tragen (das name-Attribut ist unbenutzt oder hat einen leeren Wert), oder wenn mehrere Bilder denselben Namen tragen?

        Bei allen Beispielen, die mir hier in den letzten Jahren begegnet sind, war die Verwendung des name-Attributes bei <img>-Elementen nicht gegeben - von daher dürfte auch bei Lina fraglich sein, ob sie ihre Bildelemente benannt hat und natürlich dabei keinen Namen doppelt verwendet - oder ob dem nicht so ist.

        Liebe Grüße,

        Felix Riesterer.

        --
        ie:% br:> fl:| va:) ls:[ fo:) rl:| n4:? de:> ss:| ch:? js:) mo:} zu:)
  3. Das du den NOSCRIPT einfach weglässt und einfach ein a-href Link auf das Bild direkt machst, würde ja schon vorgeschlagen.

    Auch wenn es nicht deine Frage war, würde ich dir vielleicht ein hin Tipp für deine

    jetzige "Lösung"
    <a href="#giersch" onclick="document.giersch.src='wildkrautbilder/giersch03.jpg'; document.giersch.width='800'; document.giersch.height='533'; "><noscript><a href="wildkrautbilder/giersch03.jpg" target="_blank"></noscript><img src="vswildkrautbilder/vsgiersch03.jpg" width="200" height="133" alt=""></img></a>

    Du sprichst über "document.giersch" das aktuelle Bild an. Dies ist aber eigentlich nicht notwendig, oder wählst du +49[Vorwahl][Rufnummer] nur um mit deinem Nachbarn zu sprechen? :D

    Der Trick hier ist
    http://de.selfhtml.org/javascript/sprache/objekte.htm#this@title=this.

    Mit "this" greifst du auf das aktuelle Objekt (in deinem Fall der Link) zu. Von dort aus kannst du in einer
    <a href="xxx.jpg"><img src="xxx.jpg"></a>
    Konstruktion mit "this.childNodes[0]" direkt auf das IMG-Tag zugreifen ohne irgendwelche Namen zu verwenden. D.h. du kannst nicht versehentlich invalide werden, weil du eine ID 2 mal verwendest ;) und kannst trotztdem mit Copy & Past arbeiten.

    Quasi so:
    <a href="giersch03.jpg" onclick="this.childNodes[0].src=this.href; this.childNodes[0].width='800';"><img src="vswildkrautbilder/vsgiersch03.jpg" alt="Bild" /></a>

    sieht das nicht schön übersichtlich aus? Es ist Valide, leicht zu lesen und schnell zu kopieren.