Problem mit Bildern und Grafiken in Bootstrap Seite

  • Hallo zusammen,


    zunächst mal danke, an alle die sich die Zeit nehmen und sich mein Anliegen durchlesen und mir evtl. helfen können. :)



    Ich verzweifle gerade etwas, leider. :S
    Ich habe eine Bootstrap-Seite gebaut die auch schon live ist.
    Beim testen auf allen möglichen Endgeräten war alles super.


    Jetzt ist die Seite live und auf einmal werden Bilder & Grafiken nicht mehr angezeigt. :huh:
    Grafiken die als Background in CSS eingebettet sind werden dargestellt, alles was im Code selbst
    kommt wird kurz angezeigt, und dann aber ausgeblendet. ?(


    Hat jemand eine Idee?
    Die URL ist www.laser-vet.de


    Ich finde und finde den Fehler nicht! ?(

  • Hallo


    Was passiert denn wenn du konventionelle Bild-Dateinamen verwendest? Also nur mit dem englischen Alphabet und bei Bedarf dem Unterstrich, ohne zum Beispiel dem @-Zeichen? Sonderzeichen werden vom Browser gerne mal als Steuerzeichen interpretiert.


    Für Pfad- und Dateinamen sollte grundsätzlich nur das englische Alphabet und der Unterstrich verwendet werden. Vorzugsweise nur Kleinbuchstaben. Keine deutschen Umlaute, keine speziellen Buchstaben anderer Sprachen, kein Bindestrich, keine Satzzeichen und keine Sonderzeichen.


    Der Aufbau der Seite dauert einige Zeit. Zunächst werden die Inhalte übernommen und angezeigt, auch die Bilder. Dann werden die CSS-Anweisungen, Steueranweisungen, JavaScript und so weiter umgesetzt. Also auch das, was in den Browsern für das @-Zeichen hinterlegt ist. Dabei verschwinden die Bilder dann.


    Gruss


    MrMurphy

  • Hallo MrMurphy,


    erstmal vielen Dank für deine Antwort.
    Ich habe nun alle Bilder gecheckt und in keinem Dateinamen ist ein @-Zeichen bzw. ein Umlaut enthalten. ?(
    Ich wundere mich, warum die Bilder die ich in der CSS-Datei als Background angegeben habe stehen bleiben und nur die Bilder futsch sind, die im Quelcode eingebunden sind.


    So wird das hier in einem optischen Trenn-Bereich angezeigt:

    CSS
    1. .divider1 { background-image: url('../img/bg/divider1.jpg')}





    Das hier aber zum Beispiel nicht:

    HTML
    1. <p class="text-center"><img src="assets/img/produkte/frontpage/cxr-14_17.jpg" alt=""></p>





    ?( ?( ?(



    Vielen Dank für deine Hilfe!
    Stefan

  • Hallo


    Spiel hier im Forum bitte nicht mit der Schriftgröße rum. Unterschiedliche Schriftgrößen- oder sogar -arten nerven viele Besucher.


    Zitat

    Ich habe nun alle Bilder gecheckt und in keinem Dateinamen ist ein @-Zeichen bzw. ein Umlaut enthalten.


    Dein Quellcode interessiert in diesem Zusammenhang überhaupt nicht. Sondern der Quellcode, der in den Browsern der Besucher, also zum Beispiel mir, ankommt.


    Ich habe aber grade mal zum Testen JavaScript gesperrt. Dann werden alle Bilder angezeigt. Offensichtlich wandelt das JavaScript auf deiner Seite die Dateinamen um. Das solltest du also prüfen. Damit kenne ich mich nicht aus.


    Gruss


    MrMurphy

  • Hallo an alle,


    ich habe das Problem behoben indem ich die Bootstrap-Klasse "img-responsive" entfernt und durch "img-fluid" ersetzt, den Bildern in der src einen absoluten Pfad gegeben sowie alt-tag und einen max-witdth-Wert eingegeben habe.
    Jetzt läuft die Seite auf allen Majoy-Browsern. iPhone (Safari) und Android-Samsung Handy sind getestet.


    Nach einer genaueren Fehleranalyse schaue ich nochmals und poste diese gegebenenfalls.