Internet Explorer: Überlauf und Schwimmer

StackOverflow https://stackoverflow.com/questions/1641992

Frage

Ich habe ein img innerhalb eines div. Ich habe das img auf „float: right“ gesetzt, und die div auf „overflow: hidden“. Da die div schmaler als das img ist, erwarte ich, dass der linke Teil des img abgeschnitten und versteckt werden, was in der Tat der Fall in Firefox ist. Allerdings weigert IE die „float: right“ bestätigen Eigenschaft des img, immer das img an der linken Seite des Div Verankerung und den rechten Teil des img abschneidet. Gibt es eine Abhilfe für dieses Problem? Oder mache ich etwas falsch?


** Hintergrundinformationen

Der Grund, warum ich dies tun wollen ist, weil ich das img will mit jQuerys „blind“ Effekt erscheint (von links nach rechts), und dann mit einem ähnlichen Blind Effekt verschwindet (wieder von links nach rechts).

jQuerys Standardblind Effekt nicht die verschwindenden Griff von links nach rechts. Ich vermute, dass der Grund dafür ist, dass bestimmter Modus (ausblenden vs. Show) und bestimmte Richtung (links gegen rechts oder von oben gegen unten) Kombinationen erfordern eine zusätzliche Bewegung der linken oberen Position des div. Lassen Sie mich mit einem Beispiel demonstrieren. Angenommen, wir wollen ein Bild erscheinen lassen von dem blinden Effekt links nach rechts. Nun, das ist einfach, wir setzen nur den div Überlauf versteckt, das Bild nach links zu schweben, dann der Breite des div auf die Breite des Bildes von 0 ändern. Auf der anderen Seite, wenn wir das Bild machen wollen nun von links nach rechts mit dem blinden Effekt verschwindet, haben wir das Bild setzen rechts zu schweben, und die Breite des div von der Bildbreite auf 0 schrumpfen, während des Anstoßen div der linken oberen Ecke auf der rechten Seite, um das Bild des rechten Rand stationär zu halten.

Ich habe Code geschrieben, die linke obere Ecke Bewegungen zu übernehmen, und es funktioniert in FF in Ordnung, aber nicht im Internet Explorer. Da IE nicht den Schwimmer respektieren. Recht und stattdessen besteht auf das Bild auf der linken Seite zu verankern, ist der Effekt, dass der jQuerys „slide“ anstelle der „blind“ Animation

War es hilfreich?

Lösung

Sie könnten versuchen, die folgenden für IE 7: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
</head>
<body>
<div style="overflow: hidden; width: 150px; direction: rtl;">
   <img src="yourimage.png" style="float: right" />
</div>
</body>
</html>

Die Richtung: rtl styel funktioniert für mich in IE 8 IE 7-Standards-Modus verwendet wird. IE 8 mit IE 8 Standards nicht die Richtung Art benötigen.

Hoffentlich kann Ihr Problem lösen. Ich bin mir nicht sicher, ob es mit einem anderen Inhalt arbeiten werden Sie in der div haben könnten, aber es scheint zu erreichen die Auswirkungen auf Sie mit dem Bild wollen.

Andere Tipps

Im schlimmsten Fall: ein weißes DIV über die linke Seite des Bildes schieben? Sehr Cross-Plattform aber.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top