Thema: PNG's und IE 5-6
- 09.02.2009 10:14 #1Benutzer
- Registriert seit
- 09.02.2009
- Beiträge
- 47
- Renommee-Modifikator
- 0
PNG's und IE 5-6 Hallo ihr Lieben!
Ich habe mich hier angemeldet, da ich als html-Neuling noch nicht all zu viel Wissen über solches Verfüge. Trotz allem hatte ich vor, mich in diesem Bereich etwas zu Schulen und eventuell mal Geld damti zu verdienen - mal sehen.Ich habe testweise eine Webseite bei einem der kostenlosen Anbieter angefangen. Ist natürlich erstmal nur ein Test um zu schauen, was alles machbar ist. Im großen und ganzen komme ich auch ganz gut voran. Mein Hauptproblem ist nun, daß ich aus grafischen Gründen hauptsächlich png's benutze. Nun musste ich die bittere Erfahrung machen, daß die IE 5-6 diese zumindest von selber aus diese nicht Erkennen/Unterstützen.
Das der IE grundsätzlich Schrott ist, ist ja bekannt - aber das der IE erst ab Version 7 das kann, was Opera, Firefox usw. schon lange können, hat mich umgehauen^^
Nützt nichts - Fakt ist, er kann es nicht - zumindest nicht von selber.
Bei der Suche nach einer Lösung bin ich Internet auf einige Beispiele gestoßen, nachdenen es wohl funktionieren kann, wenn man bei dem IE 5-6 durch einen html Code diese Funktion ins Leben ruft bzw. dem IE "erklärt", was ein png ist^^
Leider schaffe ich es nicht, diese Code auf meinen Seiten so einzubinden, daß es funtkioert - scheint auch recht kompliziert zu sein
Hier ein Beispiel:
<div><style type="text/css">
<!-- body {
background-position: 50% 0px;
background-repeat: no-repeat;
background-color:#08101b;
margin-top: 350px; }
//--> </style></div>
<p style="text-align: center; margin-top: 10px;"><a href="http://vivistar-jeans.beepworld.de/index.htm"><img border="0" src="http://vivistar-jeans.beepworld.de/files/home1.png" alt="" /></a><a href="http://vivistar-jeans.beepworld.de/unserprinzip.htm"><img border="0" src="http://vivistar-jeans.beepworld.de/files/unserprinzip1.png" alt="" /></a><a href="http://vivistar-jeans.beepworld.de/produkte.htm"><img border="0" src="http://vivistar-jeans.beepworld.de/files/produkte1.png" alt="" /></a><a href="http://vivistar-jeans.beepworld.de/contactkontakt.htm"><img border="0" src="http://vivistar-jeans.beepworld.de/files/kontakt1.png" alt="" /></a><a href="http://vivistar-jeans.beepworld.de/impressumagb.htm"><img border="0" src="http://vivistar-jeans.beepworld.de/files/impressum3.png" alt="" /></a></p>
1: Kennt jemand eine "einfache" Möglichkeit, daß Problem zu beheben, so daß ich meine png's benutzen kann?
2: Kennt jemand diesen Code dafür und kann diesen eventuell anhand meines Beispiel-Quelltextes so einfügen, daß ich diesen als "Grundlage" benutzen kann um alles weitere dann anzupassen?
Vielleicht kann mir da ja jemand helfen
Danke soweit schonmal!
- 09.02.2009 10:34 #2
Soweit ich informiert bin, kann der IE in diesen Versionen nur keine Transparenz in PNGs.
Ja? Nun ja, ich bin kein Freund von ihm, aber ganz so drastisch liegen die Probleme auch nichtDas der IE grundsätzlich Schrott ist, ist ja bekannt
Auch der IE7 kränkelt noch an vielen Stellen. M$ kann sich das leisten. Es benutzt trotzdem noch die Mehrheit diesen Browser, auch wenn er im Vergleich mit anderen minderwertig ist.aber das der IE erst ab Version 7 das kann, was Opera, Firefox usw. schon lange können, hat mich umgehauen
Damit kenne ich mich nicht aus, sorry. Ich würde das Bild dann wahrscheinlich einfach in ein anderes Format umwandeln.Kennt jemand eine "einfache" Möglichkeit, daß Problem zu beheben, so daß ich meine png's benutzen kann?
Aber ich kann Dir was anderes sagen:
Das ist falsch. Die Style-Angaben (wenn man sie denn unbedingt nicht als externes Styleseet einbinden will) gehören in den <head>. Da gehören aber keine Elemente wie <div> oder p hin.<div><style type="text/css">
Und der Rest, ein Textabsatz mit Links, macht semantisch nicht viel Sinn, das solltest Du statt als Textabsatz als Liste ausgezeichnet werden. Und die alt-Attribute sind alle leer, das ist auch nicht sinnvoll. Dann wird ja gar nichts angezeigt, wenn die Bilder nicht geladen werden.
Gruß,
-Efchen
- 09.02.2009 10:41 #3
Grüße und Willkommen!
Ersteinmal ein paar grundlegende Fakten:
1. HTML ist zum Auszeichnen des Textes da.
1.1. hier hast du, ich nehme es mal an, ein Menu. Ein Menu wird so dargestellt:
1.2. Bei dem <img ..>-Tag verwendest du korrekterweise das "alt"-attribut, aber du lässt es leer. Das Attribut ist dafür da, falls ein Vorlesebrowser, Textbrowser oder ein Browser bei dem die Grafiken nicht angezegit werden / augstellt sind, dieser "alt"-text (alternativ-text) angezeigt wird.Code:<ul> <li> <a href="#"> Punkt 1 </a> </li> <li> <a href="#"> Punkt 2 </a> </li> <li> <a href="#"> Punkt 3 </a> </li> ... </ul>
1.3. Bei dem <img..>-Tag solltest du die html-attribute width="xxx" und height="xxx" verwenden, somit kannst du verhindern das beim laden der text so ruckartig nach unten verschwindet und die plätze "vorreserviert werden".
1.4. Sehe ich keinen doctype oder sonstiges was ein html-dokument benötigt.
2. Styleangaben kommen endweder in den Headbereich oder aber werden ausgelagert in eine exteren css datei und mit :
im Headbereich eingefügt. Zweiteres ist zu raten, da du dadurch die Größe deiner Datei erheblich verringern kannst und obendrein es alles in einer Datei sammeln kannst.Code:<link href="deinedatei.css" media="screen" rel="stylesheet" type="text/css" />
3. ich sehe gerade das dir efchen schon geantwortet hat u schneller war...misst...(*hau*)
Wenn du unsere beiden Posts soweit befolgst, sollte es dir gut gelingen.
Gruß und viel Erfolg
Loon3yGeändert von Loon3y (09.02.2009 um 10:54 Uhr)
Versklavter Webentwickler-|- I become what never fails following the footsteps behind me. -|-
- 09.02.2009 19:20 #4HTML-Guru Meilensteine


- Registriert seit
- 12.01.2008
- Ort
- Hannover
- Alter
- 42
- Beiträge
- 2.448
- Renommee-Modifikator
- 5
Testcase der neuesten PNG-Fix-Methoden [update] » macx.de
Diese Scripte bauen auf ie proprietäre Filter auf.
Die kannst du nur auf echten Internetexplorern Testen.
Mit IE-Emulationen geht das nicht.
Überlege dir genau ob du das wirklich brauchst.
Ich antworte auch unpopulär.
- 24.02.2009 12:02 #5Benutzer
- Registriert seit
- 09.02.2009
- Beiträge
- 47
- Renommee-Modifikator
- 0
So..hat ein wenig gedauert, aber habe das ganze nun neu aufgemacht.
Die Transparenz funktioniert nun - soweit sehr schön!
Aber der IE 5 unf 6 scheint noch ein weiteres Problem zu haben: der Hover Effekt!
Funktioniert bei IE 7 und allen anderen Browser super, natürlich mal wieder nicht bei IE 5 unf 6 ^^
Beim rüberfahren mit der Maus wechselt einmalig das Bild zum Hover-Bild, aber leider nicht wieder zurück zum Ursprungsbild
Hier mal eine Seite, wo ich das Teste: Web-Emotion
Habe da schon ordenlich gesucht bei google und da das hier gefunden:
Whatever:hover
HTC Datei auf Server im dementsprechenden Ordner gespeichert, relativen Pfad in html Dokument eingefügt - geht nicht! Hab die behavior: url an vielen verschiedenen Stellen im Code probiert, ändert aber nix
Wer weiß da was? Das muss doch gehen^^
Aktive Benutzer
Aktive Benutzer
Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)
Ähnliche Themen
-
der IE und transparent PNG's
Von DaQuark im Forum HTML und XHTMLAntworten: 3Letzter Beitrag: 30.08.2007, 21:16



LinkBack URL
About LinkBacks


Lesezeichen