Spry-Problem

[Johannes11]

Hallo zusammen, ich habe gerade ein Problem bzw. möchte gerne ich wissen in wieweit es möglich ist.

Ich habe schon einmal einen hover-effekt erstelllt, dass beim drüberscrollen von headline-a headline-a_2 erscheint durch Erstellung eines Bildes was die Position verändert.

CSS-Code:

#headline a{ background: url(../img/headline.gif)}
#headline a:hover{background-position: top right;}

Jetzt würde ich gerne wissen ob ich diesen Hover-Effekt auch durch drüberscrollen eines Bildes was sich daneben befindet, erreichen kann. Sprich links befindet sich Headline-a und daneben Headline-b. Ich möchte über Headline-b drüberscrollen und aus Headline-a soll Headline-a_2 "werden".

Ich würde mich freuen, wenn mir da jemand weiterhelfen könnte ..

Liebe Grüße

Johannes

 

[Wustersoss]

Aus deiner Überschrift werde ich schon mal nicht schlau, was soll ein Spry-Problem sein?

Wenn du mit drüberscrollen den Mauszeiger meinst, dann musst du für das Ändern eines anderen Elementes dazu Javascript verwenden. Mit CSS wirst du hier nicht weit kommen.

 

[Johannes11]

Da habe ich mich wohl mit der Begrifflichkeit etwas vertan und etwas undeutlich ausgedrückt. Es geht darum, dass wenn ich mit der Maus über ein Bild scrolle, sich dessen Position verändert. Das eigentliche Bild ist nur zur Hälfte sichtbar (also doppelt so groß angelegt) und beim drüberscrollen "verschiebt" es sich quasi und die andere Hälfte ist zu sehen. Ich habe es schon einmal mit dem CSS-Code den ich oben geschrieben habe gemacht. Jetzt ist aber meine Frage, ob ich diesen Effekt auch erreichen kann bei zwei seperaten Bildern. Z.B. links ist Bild 1 und daneben befindet sich Bild 2. Ich möchte über Bild 2 drüberscrollen und Bild 1 soll sich wie beschrieben verändern. Ist das möglich (mit Html)?

Viele Grüße

 

[Wustersoss]

Die Frage habe ich dir bereits beantwortet. Wenn es sich um ein anderes Element handelt, dann Javascript.
Dein Ausdruck drüberscrollen habe ich auch noch nicht gehört. Man fährt mit der Maus über ein Bild. Srollen heisst rollen und damit sind normalerweise die Schiebebalken gemeint die einen sichtbaren Bereich wie von einer Rolle ablaufend erscheinen lassen.

Bitte etwas mehr Wert legen auf die Begrifflichkeiten bei zukünftigen Fragen im Forum.

 

[Tronjer]

Bei Spry handelt es sich um ein Framework, das Adobe mit Dreamweaver ausliefert. Kennt niemand und braucht auch keiner.

Was die Frage des Threaderstellers betrifft: Das lässt sich recht einfach mit jQuery realisieren, aber nicht in unbedingt in zwei Sätzen hier erklären, sofern du noch keine Erfahrung damit hast. Wirf mal einen Blick in das Tutorial und lies dir die Erläuterungen zu addClass() und toggleClass() durch.

jQuery: The Write Less, Do More, JavaScript Library

 

[BlueSpirit]

Du könntest auch die Box des linken Bildes so vergrößern, dass sie über das rechte Bild hinausragt, dann greift :hover ja wunderbar.