Website nicht kompatibel mit FireFox , Internet Explorer

[ScottGambler]

Wunderschönen guten Nachmittag liebe Community,

Seit meinem letzten Besuch hat sich so einiges verändert, da ich nun seit dem 18 Oktober mich fleißig mit HTML beschäftigt habe. Kommen wir mal direkt zu meinem Problem:

Ich habe eine Website entwickelt (zurzeit noch nicht online ; Also nur über ein "localhost") und es funktioniert alles wunderbar. Die Website repräsentiert sich im Opera und im Google Chrome Browser als vollständig funktionsfähig. In FireFox gibt es kleine Probleme, da immer so ein kleines Bild/Zeichen in meinen Navigations-Buttons ist aber der Rest funktioniert. Mit dem Internet Explorer Browser funktioniert die Navigation zwar noch, jedenfalls hat sie auf einmal eine Lila Umrandung es es reagiert nicht wenn man mit der Maus über den Button hovert (normalerweise würde sich das Bild dann ändern, von der Farbe her.)

Aufgrund dessen , dass ihr anhand von dem Text nicht viel anfängen könnt, will ich euch das mit Hilfe von Bilder zeigen!

Website | Browser:Opera

http://www7.pic-upload.de/30.09.13/bdoxot9b8e5.png

Website | Browser : FireFox

http://www.pic-upload.de/view-20877258/firefox_website.png.html

Website | Browser: Internet Explorer

http://www7.pic-upload.de/30.09.13/vugojct8xrvs.png

Ich hoffe ihr wisst nun was ich meine. Gemeint sind die Navigations-Knöpfe die in FireFox und Internet Explorer nicht richtig funktionieren. In Google Chrome und Opera funktioniert es perfekt!

Hoffe jemand kann mir bei dem Anliegen helfen :)

Mit freundlichen Grüßen aus Luxemburg,

ScottGambler.

 

[Space Vampire]

Das bedeutet, dass die Bilder, die dort dargestellt werden sollen, schlicht nicht da sind, wohin ihr Pfad verweist.

 

[bdt600]

Anstatt hier so riesige Bilder einzustellen, wäre ein Link zur Seite deutlich besser.

 

[ScottGambler]

Das bedeutet, dass die Bilder, die dort dargestellt werden sollen, schlicht nicht da sind, wohin ihr Pfad verweist.

Danke für die schnelle Antwort. Aber wie kann man das beheben? Habe schon versucht die Bilder hochzuladen, und dann den Pfad einzugeben, aber es wird mir trotzdem immer wieder dieses Symbol angezeigt.

Anstatt hier so riesige Bilder einzustellen, wäre ein Link zur Seite deutlich besser.

Done.

 

[Sentence]

Super, jetzt noch nen Link zum Quelltext!

 

[ScottGambler]

Super, jetzt noch nen Link zum Quelltext!

Ich habe alles noch überlesen und habe den Fehler gefunden. Brauche aber jemanden der mich wieder auf die richtige Spur bringt.

Das hier verursacht das, was Space Vampire bereits gesagt hat. Da hier kein Pfad zum Bild angegeben wurde, entsteht dieses "Kein Pfad" Symbol dann.

<div id="navi">

<ul>
    <li><a href="Startseite.html"> <img src="" width="100" height="40" class="startseite" alt="" /> </a></li>

</ul>
</div>

und die jeweilige Klasse in CSS:

  img.startseite {
  background-image: url(Startseite1.png);
        }
img.startseite:hover {
background-image: url(Startseite2.png);
  }

So, das Problem ist nun, wenn ich bei "img src" den Pfad eingebe, wird dieses Bild dauerhaft verwendet und somit würde man nicht mehr erkennen , wenn jemand über den Button hovert (mit der Maus drüber fährt.) Ich weiß nun nicht wie ich das beheben kann, dass ich dieses "Kein Pfad" Symbol nicht mehr habe, und trotzdem den Hover-Effekt behalte . (Ja mir ist klar dass wenn ich bei img src einfach "Startseite1.png" eingeben würde das Symbol weg wäre, aber dann auch der Hover-Effekt)

Hoffe jemand weiß da weiter :)

 

[Tronjer]

Ich habe alles noch überlesen und habe den Fehler gefunden. Brauche aber jemanden der mich wieder auf die richtige Spur bringt.

So, das Problem ist nun, wenn ich bei "img src" den Pfad eingebe, wird dieses Bild dauerhaft verwendet und somit würde man nicht mehr erkennen , wenn jemand über den Button hovert (mit der Maus drüber fährt.) Ich weiß nun nicht wie ich das beheben kann, dass ich dieses "Kein Pfad" Symbol nicht mehr habe, und trotzdem den Hover-Effekt behalte . (Ja mir ist klar dass wenn ich bei img src einfach "Startseite1.png" eingeben würde das Symbol weg wäre, aber dann auch der Hover-Effekt)

Hoffe jemand weiß da weiter :)

Lösche das <img>-Tag, lege das background-image auf das <a> und gib diesem zusätzlich ein display: block, sowie with und height des Bildes.

Und bei der Gelegenheit solltest du gleich den den aktuellen Firefox nebst Firebug installieren. Der Firebug zeigt dir, welche Ressourcen nicht geladen werden können und ist überdies ein WYSIWYG-Tool für temporäre Änderungen.

 

[ScottGambler]

Lösche das <img>-Tag, lege das background-image auf das <a> und gib diesem zusätzlich ein display: block, sowie with und height des Bildes.

Und bei der Gelegenheit solltest du gleich den den aktuellen Firefox nebst Firebug installieren. Der Firebug zeigt dir, welche Ressourcen nicht geladen werden können und ist überdies ein WYSIWYG-Tool für temporäre Änderungen.

danke :)