2 CSS Probleme

[mangani84]

Hallo zusammen,
habe wiedermal ein Anliegen und brauche da eure Hilfe.

Schaut mal bitte die Testseite www.beigelsdschungel.de - Testseite an.

Problem 1: Wenn ich bei dem Foto über das Hinterteil der Spinne mit der Maus fahre, vergrößert sich das Detailfoto, genauso wie beim Kopf. Das Problem ist, dass die Darstellung im Firefox stimmt, aber im Internetexplorer nicht????

Problem2: wie kann ich die Ausrichtung vom linken Detailfoto auch nach links einstellen. Leider öffnet sich das Foto in rechter Richtung.

Ich hoffe ihr könnt mir unter die Arme greifen?

Gruß
mangani84

 

[mangani84]

Oh, kann mir wirklich keine von euch helfen? :cry:

 

[neuroleptika]

Oh, kann mir wirklich keine von euch helfen? :cry:

Welchen IE meinst du denn?
Im IE7 und IE6 funktioniert es bei mir.

Zur Positionierung:
Soweit ich das verstanden habe müßtest du die Positionierung der Hintergrundgrafiken in px angeben:

a:hover, a:focus
background-color:#FFFFFF;
[COLOR="DarkRed"][B]background-position:-200px center;[/B][/COLOR]
clear:left;
color:#000000;
float:left;
[COLOR="DarkRed"][B]background-repeat:no-repeat;[/B][/COLOR]
}

Den Wert für background-position habe ich mir ungetestet ausgedacht.

Toller Effekt

 

[mangani84]

Hallo und vielen Dank für deine Hilfe.

Komischerweise ist die Darstellung der Detailbilder mit dem IE6 mit meinem Computer falsch und mit dem IE 6 auf dem Laptop aber doch richtig???? Das muss ich nicht verstehen oder? :)

Nichts so trotz funktioniert die Verschiebung des vergrößerten Detailbildes nach links leider nicht. Habe deinen Code angewendet und das Ergebnis ist, dass sich das Bild in der zu öffnenden Position nicht ändert, sondern dass etwas aus dem Bild rausgeschnitten wird?
Das Bild sollte sich aber in seiner kompletten vergrößerten Größe in die linke Richtung öffnen lassen.

Wat mach ich denn da jetzt? :???:

 

[neuroleptika]

Komischerweise ist die Darstellung der Detailbilder mit dem IE6 mit meinem Computer falsch und mit dem IE 6 auf dem Laptop aber doch richtig???? Das muss ich nicht verstehen oder? :)

Ich weiß nicht woran das liegen mag.
Ich habe es mir mit einer IE6 sp1 / Emulation angesehen. Einen richtigen IE6 unter xp habe ich zur Zeit nicht.

Nichts so trotz funktioniert die Verschiebung des vergrößerten Detailbildes nach links leider nicht. Habe deinen Code angewendet und das Ergebnis ist, dass sich das Bild in der zu öffnenden Position nicht ändert, sondern dass etwas aus dem Bild rausgeschnitten wird?
Das Bild sollte sich aber in seiner kompletten vergrößerten Größe in die linke Richtung öffnen lassen.

Das hab ich irgendwie falsch verstanden. Ich habe gedacht du möchtest, daß sich die Bilder an einem bestimmten Punkt decken.

a:hover, a:focus {
background-color:#FFFFFF;
[COLOR="DarkRed"]position:relative;
left:-50px;
top:-100px;[/COLOR]

Jetzt wird <a> bei focus nach oben, links verschoben.
Die Werte habe ich mir wieder ausgedacht.
Du darfst <a> nicht soweit verschieben, daß es unter der Mausposition verschwindet. Sonst ist der hover-Zustand sofort wieder beendet.
Gegebenenfalls mußt du width und height bei hover anpassen.

 

[Junny]

Ohne ehrlich gesagt das Problem genau verstanden zu haben: Bei der Hintergrundbildpositionierung darf man Angaben in Pixeln nicht mit Schlüsselwörtern wie center mischen. Liegt es vielleicht daran?

background-position: Hintergrund positionieren: CSS-Referenz auf CSS 4 You - The Finest in Stylesheets

Positive und negative Werte sind erlaubt.
Wird nur ein Wert angegeben, so legt dieser die horizontale Position fest. Die vertikale Position liegt dann bei 50%.
Sind zwei Werte angegeben, so bestimmt der Erste die horizontale und der Zweite die vertikale Position. Längen- Prozentangaben und Schlüsselworten dürfen gemischt werden. Hier die erlaubten Kombinationen:
background-position:Längenangabe Längenangabe
background-positionrozentangabe Längenangabe
background-position:Längenangabe Prozentangabe
background-position:Schlüsselwort Schlüsselwort

Gruß
Junny

 

[neuroleptika]

Tach Junny,
er will nicht das Hintergrunbild im a-tag verschieben sondern das ganze Element.
Hab ich auch erst falsch verstanden.
Mit position:relative; geht das.

Bei der Hintergrundbildpositionierung darf man Angaben in Pixeln nicht mit Schlüsselwörtern wie center mischen

Auch Kai Laborenz hat in "css-Praxis (4.Aufl.)" geschrieben, daß es in css2.1 nicht (mehr) erlaubt sei.
Auf Cascading Style Sheets { Vollreferenz zu CSS 1 und CSS 2.1 : BACKGROUND-POSITION } steht es sei erlaubt.

Ich habe das eben in verschiedenen Browsern ausprobiert. Haben alle brav mitgemacht.

 

[mangani84]

Hallo zusammen und vielen Dank.
Habe es hinbekommen. Mit einem negativen margin-left Wert habe ich den Effekt erzielt ;). Oh mann, stundenlang probiert und nicht drauf gekommen.