Problematika: Bildergalerie

Hallo meine Lieben!

Ich schlage mich nun schon seit geraumer Zeit mit einem IE-Problem herum...

habe eine Homepage (Laien-Version) erstellt, bei welcher ich auch eine Bildergalerie mit Vorschau eingefügt habe (JS).
Die Bildergalerie an sich funktioniert, nur dass im IE (bei Firefox, Safari usw. keinerlei Probleme) die Vorschaubilder nicht korrekt angezeigt werden (nur vertikale oder horizontale Striche).

Kann mir da vielleicht jemand helfen? Wäre euch sehr verbunden...

An dieser Stelle werden die Thumbnails sehr gut angezeigt: http://www.maggie-moden.at/fotogalerie.html

nur hier leider nicht mehr:

http://www.maggie-moden.at/modenschau06062014.html

Lieben Gruß
Problematika

  1. Hallo Problematika,

    kann dein problem im IE11 unter win7 nicht nachvollziehen. Die Bilder sind genauso zu sehen wie im FF 29.0.1. Allerdings: Der Hintergrund mit dem Farbverlauf fehlt im IE.

    Du hast laut Validator auch noch 22 Fehler und 4 Warnungen drin.

    Ich halte es für sinnvoll, sich diese mal anzuschauen. Das meiste scheinen Standardfehler zu sein, wo die Beschreibung selbsterklärend ist (wie zum Beispiel fehlende "Alt" Attribute für Bilder). Falls es zum Thema Validator noch Fragen geben sollte, melde dich nochmal

    Viele Grüße mbr

    1. Hallo Problematika,

      kann dein problem im IE11 unter win7 nicht nachvollziehen. Die Bilder sind genauso zu sehen wie im FF 29.0.1. Allerdings: Der Hintergrund mit dem Farbverlauf fehlt im IE.

      Du hast laut Validator auch noch 22 Fehler und 4 Warnungen drin.

      Ich halte es für sinnvoll, sich diese mal anzuschauen. Das meiste scheinen Standardfehler zu sein, wo die Beschreibung selbsterklärend ist (wie zum Beispiel fehlende "Alt" Attribute für Bilder). Falls es zum Thema Validator noch Fragen geben sollte, melde dich nochmal

      Viele Grüße mbr

      Dank dir für deine Hilfe! Ich denke es ist eher ein IE9-Problem... werde mich um die Fehlerchen kümmern. Im Falle dass ich nicht klarkomme danke ich dir schon mal auf das Herzlichste für deine Hilfe!

  2. Hallo Problematika,

    ein Blick in die Browser-Konsole von Firefox hätte genügt:

    ReferenceError: womAdd is not defined modenschau06062014.html:17
    SyntaxError: Using //@ to indicate sourceMappingURL pragmas is deprecated. Use //# instead jquery-1.10.2.min.js:1
    Error: http://www.maggie-moden.at/js/jquery-1.10.2.min.js is being assigned a //# sourceMappingURL, but already has one
    Die Zeichenkodierung des HTML-Dokuments wurde nicht deklariert. Das Dokument wird in manchen Browser-Konfigurationen mit verstümmeltem Text dargestellt, wenn das Dokument Zeichen außerhalb des US-ASCII-Bereichs enthält. Die Zeichenkodierung der Seite muss im Dokument oder Transferprotokoll deklariert werden. modenschau06062014.html

    1. Hallo Problematika,

      ein Blick in die Browser-Konsole von Firefox hätte genügt:

      ReferenceError: womAdd is not defined modenschau06062014.html:17
      SyntaxError: Using //@ to indicate sourceMappingURL pragmas is deprecated. Use //# instead jquery-1.10.2.min.js:1
      Error: http://www.maggie-moden.at/js/jquery-1.10.2.min.js is being assigned a //# sourceMappingURL, but already has one
      Die Zeichenkodierung des HTML-Dokuments wurde nicht deklariert. Das Dokument wird in manchen Browser-Konfigurationen mit verstümmeltem Text dargestellt, wenn das Dokument Zeichen außerhalb des US-ASCII-Bereichs enthält. Die Zeichenkodierung der Seite muss im Dokument oder Transferprotokoll deklariert werden. modenschau06062014.html

      Herzlichen Dank für deine Antwort!
      Leider bin ich absolut kein JS-Experte, sondern ein kompletter Laie was das betrifft. Könntest du mir die Arbeitssschritte (für Dummies also) kurz erklären? Das wäre wirklich supernett!

    2. Hallo Problematika,
      das, was Wiko schreibt hatte ich glatt übersehen

      ein Blick in die Browser-Konsole von Firefox hätte genügt:

      1.

      ReferenceError: womAdd is not defined modenschau06062014.html:17

      Du hast im head Bereich deines HTML folgenden Javascript Schnippsel:

      										<script type="text/javascript">  
      					//<![CDATA[  
      function setScreenClass(){var fmt = document.documentElement.clientWidth;var cls = (fmt<=980)?'screen_med':((fmt>980)?'screen_hi':'screen_hi');if(document.body.className!=cls) document.body.className=cls;};window.onresize = setScreenClass;womAdd('setScreenClass()');//]]>  
      					</script>  
      
      

      Hier wird ganz am Ende die Funktion "womAdd" aufgerufen, die aber anscheinend nirgendwo definiert ist. Ich bin mit diesem JS code nicht sonderlich vertraut, aber du als Ersteller der Seite solltest wahrscheinlich wissen, was du damit erreichen wolltest.

      2.

      SyntaxError: Using //@ to indicate sourceMappingURL pragmas is deprecated. Use //# instead jquery-1.10.2.min.js:1

      Bin kein Experte für jquery, aber nach meiner - flüchtigen - Recherche kannst du dieses Problem durch ein Update des frameworks lösen. Googeln nach diesem Problem bringt zum Beispiel folgendes

      3.

      Error: http://www.maggie-moden.at/js/jquery-1.10.2.min.js is being assigned a //# sourceMappingURL, but already has one

      Sollte sich nach der Behebung von 2. hoffentlich erledigt haben

      4.

      Die Zeichenkodierung des HTML-Dokuments wurde nicht deklariert. Das Dokument wird in manchen Browser-Konfigurationen mit verstümmeltem Text dargestellt, wenn das Dokument Zeichen außerhalb des US-ASCII-Bereichs enthält. Die Zeichenkodierung der Seite muss im Dokument oder Transferprotokoll deklariert werden. modenschau06062014.html

      Dies ist "nur" eine Warnung. Du solltest eine Zeichenkodierung angeben. Es gibt - grob gesagt - drei verschiedene Arten, das zu tun:

      • Serverkonfiguration
      • Serverseitige Scriptsprachen (PHP, PERL, etc...)
      • im HTML Dokument
        Ich würde dir zur dritten Lösung raten. Dazu mußt du nur im HTML Dokument irgendwo zwischen <head> und </head> - am besten möglichtst früh - folgendes einfügen:

      <meta charset="utf-8">

      Ich habe als Kodierung UTF-8 gewählt, was heute Standard sein sollte. Wichtig ist, dass du auch in deinem Text-editor, mit dem du die Seiten erstellst diese Kodierung einstellen solltest.
      Für weitere Informationen empfehle ich diesen Artikel aus dem Wiki von SELFHTML

      Übrigens gibt es in der Browser-Konsole noch weitere Tabs und der Tab "CSS" zeigt auch noch Fehler und Warnungen an:

      'none' oder URL erwartet, aber 'progid' gefunden.  Fehler beim Verarbeiten des Wertes für 'filter'.  Deklaration ignoriert. screen.css:16
      Fehler beim Verarbeiten des Wertes für 'text-decoration'.  Deklaration ignoriert. screen.css:49
      ',' oder '{' erwartet, aber 'html' gefunden.  Regelsatz wegen ungültigem Selektor ignoriert. screen.css:179
      ',' oder '{' erwartet, aber 'html' gefunden.  Regelsatz wegen ungültigem Selektor ignoriert. screen.css:184
      Fehler beim Verarbeiten des Wertes für 'text-decoration'.  Deklaration ignoriert. screen.css:228
      Fehler beim Verarbeiten des Wertes für 'direction'.  Deklaration ignoriert. screen.css:324
      ':' erwartet, aber '.' gefunden.  Deklaration ignoriert. screen.css:345
      Unerwartetes Dateiende beim Suchen nach Abschließende } des Deklarationsblockes. screen.css:350
      Unbekannte Eigenschaft '-moz-opacity'.  Deklaration ignoriert. lightbox.css:16
      'none' oder URL erwartet, aber 'alpha(' gefunden.  Fehler beim Verarbeiten des Wertes für 'filter'.  Deklaration ignoriert. lightbox.css:17
      Unbekannte Eigenschaft '-moz-border-radius'.  Deklaration ignoriert. lightbox.css:36
      Deklaration erwartet, aber '*' gefunden.  Übersprungen bis zur nächsten Deklaration lightbox.css:50
      Unbekannte Eigenschaft '-moz-border-radius'.  Deklaration ignoriert. lightbox.css:55
      Deklaration erwartet, aber '*' gefunden.  Übersprungen bis zur nächsten Deklaration lightbox.css:145
      Unbekannte Eigenschaft '-moz-border-radius-bottomleft'.  Deklaration ignoriert. lightbox.css:147
      Unbekannte Eigenschaft '-moz-border-radius-bottomright'.  Deklaration ignoriert. lightbox.css:150
      'none' oder URL erwartet, aber 'progid' gefunden.  Fehler beim Verarbeiten des Wertes für 'filter'.  Deklaration ignoriert. lightbox.css:196
      'none' oder URL erwartet, aber 'progid' gefunden.  Fehler beim Verarbeiten des Wertes für 'filter'.  Deklaration ignoriert.

      Viele Grüße

      mbr