Hovereffekt ohne Verweis in css-File

[weltio]

Guten Abend,

ich habe folgendes vor:
Ich habe 10 Bilder, die alle mit einem Hovereffekt ausgestattet werden sollen. Die Bilder werden alle zufällig und dynamisch aus einer Datenbank geladen, weshalb es nicht möglich ist, die Pfade in das CSS-File zu schreiben.
Nun ist die Frage, wie ich das am klügsten realisiere.
Ich habe gedacht, man könnte das mit dem Verschieben von Bildern realisieren. (Soweit habe ich das zwar vorbereitet, allerdings scheint das nicht wirklich zu klappen)
Also habt ihr ne Idee?

[Steel]

Hi!

Ich habe 10 Bilder, die alle mit einem Hovereffekt ausgestattet werden sollen. Die Bilder werden alle zufällig und dynamisch aus einer Datenbank geladen, weshalb es nicht möglich ist, die Pfade in das CSS-File zu schreiben.

Warum? Zur Not erstelle das CSS-File dynamisch...

Nun ist die Frage, wie ich das am klügsten realisiere.

Ne. Die Frage ist: Was verstehst Du unter Hovereffekt? Das wird mir hier nicht so wirklich klar. Handelt es sich gar um Links? Beschreib doch mal, was Du machst, was du machen willst und was dich hindert.

Ich habe gedacht, man könnte das mit dem Verschieben von Bildern realisieren. (Soweit habe ich das zwar vorbereitet, allerdings scheint das nicht wirklich zu klappen)

Jain. Sicher sind Hovereffekte mit CSS-Sprites keine schlechte Idee und funktionieren eigentlich gut. Die Frage was genau Du eigentlich machen willst, bleibt aber.

Also habt ihr ne Idee?

Bestimmt.

Wenn Du eine etwas genauere Beschreibung lieferst, was Du willst.

[weltio]

Warum? Zur Not erstelle das CSS-File dynamisch...

Das ist unmöglich und dazu sehr unschön. Vor allem auch ineffizient?!

Ne. Die Frage ist: Was verstehst Du unter Hovereffekt? Das wird mir hier nicht so wirklich klar. Handelt es sich gar um Links? Beschreib doch mal, was Du machst, was du machen willst und was dich hindert.

Ich möchte Bilder (gezeigt als Thumbnails) erst in S/W, bei Mausberührung in Farbe darstellen. Diese sind dann zur Originaldatei gelinkt.

[Steel]

Warum? Zur Not erstelle das CSS-File dynamisch...
Das ist unmöglich und dazu sehr unschön. Vor allem auch ineffizient?!

?

Das sind ja gleich 3 Dinge auf einmal! Ich finde, alle 3 Dinge treffen nicht zu. Warum ist es unmöglich?

Ne. Die Frage ist: Was verstehst Du unter Hovereffekt? Das wird mir hier nicht so wirklich klar. Handelt es sich gar um Links? Beschreib doch mal, was Du machst, was du machen willst und was dich hindert.
Ich möchte Bilder (gezeigt als Thumbnails) erst in S/W, bei Mausberührung in Farbe darstellen. Diese sind dann zur Originaldatei gelinkt.

Also gut. Angenommen es ist nicht möglich, das CSS zu generieren: Dann kannst Du IDs oder Klassen verteilen. Diese sind dann im CSS mit den entsprechenden Grafiken versehen. Natürlich muss das CSS dann alle Grafiken enthalten, ob benutzt oder nicht. Das finde ich, ab einer gewissen Menge, allerdings ineffizient und unschön.

Den Hovereffekt realisierst Du als Hintergrundgrafik in deinen Links. Dazu kannst Du CSS Sprites benutzen. Dafür besteht jedes Grafik aus den für die Effekte genutzen Bildern. Der Trick dabei: Das Element ist so groß, wie eins der Bilder in der Grafik. Die Grafik wird als Hintergrundelement geladen. Beim Hovern verschiebt man nun das Hintergrundbild auf die Position der Hovergrafik. Tutorials hierfür findet man zuhauf.

'Plain vanilla' wäre die Option für jeden Hovereffekt eine eigene Grafik als Hintergrund zu benutzen. Ganz ohne Tricks und mit allen dazugehörenden Ladezeiten. Fürn Anfang aber auch nciht verkehrt.

Mal was ganz anderes: Ich gehe die ganze Zeit von einer serverseitigen Sprache für die Generierung des Codes und der zufälligen Grafiken aus. Sind wir da eigentlich konform? Denn weder HTML noch CSS sind Programmiersprachen und verfügen entsprechend nicht über die nötigen Mechanismen Zufallscode zu generieren.

[weltio]

Das sind ja gleich 3 Dinge auf einmal! Ich finde, alle 3 Dinge treffen nicht zu. Warum ist es unmöglich?

Später.

Also gut. Angenommen es ist nicht möglich, das CSS zu generieren: Dann kannst Du IDs oder Klassen verteilen. Diese sind dann im CSS mit den entsprechenden Grafiken versehen. Natürlich muss das CSS dann alle Grafiken enthalten, ob benutzt oder nicht. Das finde ich, ab einer gewissen Menge, allerdings ineffizient und unschön.

Ja, das ist ebenfalls ineffizient und unschön. Man müsste ja mit jedem neuen Bild in der DB das css-file ändern...

Den Hovereffekt realisierst Du als Hintergrundgrafik in deinen Links. Dazu kannst Du CSS Sprites benutzen. Dafür besteht jedes Grafik aus den für die Effekte genutzen Bildern. Der Trick dabei: Das Element ist so groß, wie eins der Bilder in der Grafik. Die Grafik wird als Hintergrundelement geladen. Beim Hovern verschiebt man nun das Hintergrundbild auf die Position der Hovergrafik. Tutorials hierfür findet man zuhauf.

Ja, ich weiß, wie das theoretisch funktioniert und ich habe auch schon einige Tutorials dazu gelesen. Das Problem dabei ist, dass man damit keine <img...> bearbeiten kann.

'Plain vanilla' wäre die Option für jeden Hovereffekt eine eigene Grafik als Hintergrund zu benutzen. Ganz ohne Tricks und mit allen dazugehörenden Ladezeiten. Fürn Anfang aber auch nciht verkehrt.

Ich habe in dem anderen Beitrag schon geschrieben, dass ich es mit clip probiert habe - willste da ma nachgucken? :D

Mal was ganz anderes: Ich gehe die ganze Zeit von einer serverseitigen Sprache für die Generierung des Codes und der zufälligen Grafiken aus. Sind wir da eigentlich konform? Denn weder HTML noch CSS sind Programmiersprachen und verfügen entsprechend nicht über die nötigen Mechanismen Zufallscode zu generieren.

Sowohl mysql als auch php beherrschen diese Funktion allerdings. Und im Php-Script werden auch die lines in html kreiert, die allerdings zufällige Images aus der mysql-DB benutzen.
Ja, es ist serverseitig :D

Das Clip würde wahrscheinlich gut funktionieren. Ich gehe doch recht in der Annahme, dass der Rechenaufwand nur geringfügig größer oder gleich der Variante aus den Tutorials ist?
Danke im Übrigen für dein Interesse

[Steel]

Moin!

Ja, das ist ebenfalls ineffizient und unschön. Man müsste ja mit jedem neuen Bild in der DB das css-file ändern...

Ausser man hat dynamisch generiertes CSS oder bekommt es eh gleich aus der DB. Unueblich ist das nicht.

Ja, ich weiß, wie das theoretisch funktioniert und ich habe auch schon einige Tutorials dazu gelesen. Das Problem dabei ist, dass man damit keine <img...> bearbeiten kann.

Es sind ja auch Links. Du redest von Images ich von Hintergrundbildern. Das sind verschiedene Paar Schuhe. Gibt es einen Grund, warum du Images benutzen willst?

'Plain vanilla' wäre die Option für jeden Hovereffekt eine eigene Grafik als Hintergrund zu benutzen. Ganz ohne Tricks und mit allen dazugehörenden Ladezeiten. Fürn Anfang aber auch nciht verkehrt.
Ich habe in dem anderen Beitrag schon geschrieben, dass ich es mit clip probiert habe - willste da ma nachgucken? :D

Clip hat nichts damit zu tun fuer jeden Hovereffekt eine eigene Hintergrundgrafik einzusetzen. ;)

Das Clip würde wahrscheinlich gut funktionieren. Ich gehe doch recht in der Annahme, dass der Rechenaufwand nur geringfügig größer oder gleich der Variante aus den Tutorials ist?

Clip _koennte_ funktionieren. Code zeigst Du ja keinen. Allerdings gibts da einige Ecken und Kanten die es etwas verkomplizieren. Wahrscheinlich bist Du schon ueber ein bis hundert von denen gestolpert... ;) Ich wuerds schlicht nicht mit Clip umsetzen.

ein paar Beispiele:

• Das Element muss absolut positioniert sein. (bloed genug)
• Es muss einen anderen Overflowwert als visible haben.
• Der IE bis einschliesslich 7 schluckt die CSS 2.1 konforme Wertzuweisung mit Kommas als Trennzeichen nicht. Jedenfalls nicht im standardkonformen Modus, wo man ihn aber gewoehnlich haben will. (Standardkonformer Modus und IE sind irgendwie ein Paradoxon)

Das sind nur ein paar Eigenheiten von clip itself. Dazu kommt, dass Du beim Wechsel des Anzeigebereichs auch noch die Position verschieben musst. Border erwaehne ich nicht im Detail, ich nehm an die willst Du nicht?

Generell wuerde ich sagen Clip ist komplizierter und ineffizienter als einfach ein Hintergrundbild zu positionieren.

Danke im Übrigen für dein Interesse

Och. Ich wunder mich schon, warum hier noch keiner seinen Senf dazu beigetragen hat. Im senfen gibts hier Weltmeister. ;)

[weltio]

Ausser man hat dynamisch generiertes CSS oder bekommt es eh gleich aus der DB. Unueblich ist das nicht.

Wie meinst du das "bekommt es aus der DB"? Css-File in DB? O.o
Dynamisch generiert... Naja, das muss ich mir unter den gegebenen Gesichtspunkten nocheinmal überlegen...

Es sind ja auch Links. Du redest von Images ich von Hintergrundbildern. Das sind verschiedene Paar Schuhe. Gibt es einen Grund, warum du Images benutzen willst?

Jain. Auch mit Links hat das bisher nicht so geklappt, wie ich wollte. (Wie gesagt, ich sträube mich immernoch etwas (aber mittlerweile etwas weniger) mit jedem Aufruf ein neues css-File zu generieren, in das ich dann die Links zu den (nun Background)-Bildern packe.
Es sollte allerdings reichen das css-File nur auf die nötigen Zeilen zu beschränken und die Hauptaufgabe in ein anderes zu schreiben?
Kann man das irgendwie puffern oder muss der Schreibzugriff auf die HD erfolgen? Inline kann man das auch nicht erledigen oder?

Clip hat nichts damit zu tun fuer jeden Hovereffekt eine eigene Hintergrundgrafik einzusetzen. ;)

Achne, aber das müsste ich an und für sich ebenso mit nem dyncss-file regeln... Und der Thumbcreator mit beiden Zuständen ist schon geschrieben^^ Wäre doch ein Rückschritt? :D

Clip _koennte_ funktionieren. Code zeigst Du ja keinen. Allerdings gibts da einige Ecken und Kanten die es etwas verkomplizieren. Wahrscheinlich bist Du schon ueber ein bis hundert von denen gestolpert... ;) Ich wuerds schlicht nicht mit Clip umsetzen.

Nungut, Clip ist auch keine Lösung. (Was qualifiziert dich dazu, mir ein Beispiel an deiner Umsetzung zu nehmen? :D)

Und zum IE... Das ist mir sowas von egal. Wenn jemand diesen Browser nutzt, dann kann ich ihm nicht helfen... Schlimm genug, dass das Mutter-OS so weit verbreitet ist. Der ist für mich völlig irrelevant und wird auch nicht weiter beachtet.

Och. Ich wunder mich schon, warum hier noch keiner seinen Senf dazu beigetragen hat. Im senfen gibts hier Weltmeister. ;)

Ach? Was habe ich denn zu erwarten? Ich kann auch zurücksenfen!

[weltio]

Wie meinst du das "bekommt es aus der DB"? Css-File in DB? O.o
Dynamisch generiert... Naja, das muss ich mir unter den gegebenen Gesichtspunkten nocheinmal überlegen...

Das bedeutet doch aber, dass ich für jede Seite auf der die Bilder (und da es eine Seite für bildende Kunst ist, sind es viele) d.h. quasi für jeden Klick ein neues css-File generieren soll. Das ist doch mega ineffektiv.
Wie löst man das denn klassischerweise? (und nein: JS und Flash, etc.pp. kommen nicht in Frage)
Man stelle sich also eine Seite vor, auf der viele Bilder zu sehen sind. Und diese Bilder sind nach Kategorien geordnet. Man müsste doch jetzt, angenommen 20 Bilder auf einer Seite, anzahl(Bilder)/20 css-Files haben. Korrekt? (Ich meine, lieber das, als die alle mit jedem Schritt neu generieren zu müssen)

[Der Martin]

Hallo,

Dynamisch generiert... Naja, das muss ich mir unter den gegebenen Gesichtspunkten nocheinmal überlegen...
Das bedeutet doch aber, dass ich für jede Seite auf der die Bilder (und da es eine Seite für bildende Kunst ist, sind es viele) d.h. quasi für jeden Klick ein neues css-File generieren soll. Das ist doch mega ineffektiv.

nein, und nein.
Keiner würde auf die Idee kommen, bei jedem Aufruf eine Datei zu generieren. Es geht darum, das Stylesheet dynamisch anhand der aktuellen Anforderung zu erzeugen und direkt an den Client auszuliefern. Vom Umweg über eine Datei hat niemand gesprochen (ah, doch: Steel erwähnte das, hat's aber sicher nicht so gemeint).
Und wenn du dieses dynamisch generierte Stylesheet auch noch direkt in die HTML-Ressource schreibst, die du ja wegen der zufällig ausgewählten Bilder sowieso schon dynamisch erzeugst, ergibt sich dadurch auch keine Verschlechterung der Performance.

Man stelle sich also eine Seite vor, auf der viele Bilder zu sehen sind. Und diese Bilder sind nach Kategorien geordnet. Man müsste doch jetzt, angenommen 20 Bilder auf einer Seite, anzahl(Bilder)/20 css-Files haben. Korrekt? (Ich meine, lieber das, als die alle mit jedem Schritt neu generieren zu müssen)

Hmm. Ich verstehe dein eigentliches Problem immer noch nicht.

So long,
 Martin

[Steel]

Hi!

(ah, doch: Steel erwähnte das, hat's aber sicher nicht so gemeint).

Richtig. Man erstellt ja gewoehnlich auch nicht eine HTML Seite dynamisch sondern nur den Inhalt. Der kann dann auch aus einer DB kommen. Ich seh da kein Problem.

[Steel]

Moin moin!

Wie meinst du das "bekommt es aus der DB"? Css-File in DB? O.o

Wo die angeforderte Ressource ihren Inhalt herbekommt ist doch reichlich egal, oder nicht?

Dynamisch generiert... Naja, das muss ich mir unter den gegebenen Gesichtspunkten nocheinmal überlegen...

Waere die einfachste Sache wuerd ich denken.

Es sind ja auch Links. Du redest von Images ich von Hintergrundbildern. Das sind verschiedene Paar Schuhe. Gibt es einen Grund, warum du Images benutzen willst?
Jain. Auch mit Links hat das bisher nicht so geklappt, wie ich wollte. (Wie gesagt, ich sträube mich immernoch etwas (aber mittlerweile etwas weniger) mit jedem Aufruf ein neues css-File zu generieren, in das ich dann die Links zu den (nun Background)-Bildern packe.

Du erstellst einen Link, der so gross ist, wie eine Grafik. Dann nimmst Du ein Bild mit allen Grafiken fuer die diversen Zustaende des Links als Hintergrundbild. Fertig. Musst nur noch das Hintergrundbild verschieben. Moechtest Du es Barrierefrei, hat der Link einen vernuenftigen Text, der mit CSS ausgeblendet wird. Wie gesagt: Tutorials findest Du reichlich.

Es sollte allerdings reichen das css-File nur auf die nötigen Zeilen zu beschränken und die Hauptaufgabe in ein anderes zu schreiben?

Du kannst natuerlich mit mehreren CSS Dateien arbeiten. Das ist aber eher unschoen.

Kann man das irgendwie puffern oder muss der Schreibzugriff auf die HD erfolgen? Inline kann man das auch nicht erledigen oder?

Du musst gar nichts auf die Platte schreiben. Du sollst es nur ausliefern. Wenn Die Bilder irgendwie Tageszeitabhaengig sein sollen, kannst Du gern eine Datei erstellen und deise benutzen, bis es Zeit wird eine andere zu erstellen.

Ja natuerlich kannst Du das auch per Inline-Styles erledigen. Ist zwar nicht optimal, aber legitim. Faellt fuer mich genauso unter CSS wie CSS Bereiche im head oder in einer externen Datei...

Clip hat nichts damit zu tun fuer jeden Hovereffekt eine eigene Hintergrundgrafik einzusetzen. ;)
Achne, aber das müsste ich an und für sich ebenso mit nem dyncss-file regeln... Und der Thumbcreator mit beiden Zuständen ist schon geschrieben^^ Wäre doch ein Rückschritt? :D

Rueckschritt? Jain. Ist halt eher Basic. Schoener ist natuerlich die verschiedenen Sprites in einer Datei zu haben.

Clip _koennte_ funktionieren. Code zeigst Du ja keinen. Allerdings gibts da einige Ecken und Kanten die es etwas verkomplizieren. Wahrscheinlich bist Du schon ueber ein bis hundert von denen gestolpert... ;) Ich wuerds schlicht nicht mit Clip umsetzen.
Nungut, Clip ist auch keine Lösung. (Was qualifiziert dich dazu, mir ein Beispiel an deiner Umsetzung zu nehmen? :D)

Hm. Du hast Recht! Vermutlich liest aus dem Forum hier niemand sonst mit und erhebt deshalb keine Einsprueche. ;) Meinen Background kennst du jedenfalls nicht. Und ich koennte Dir viel erzaehlen solange die Tastatur haelt.

Und zum IE... Das ist mir sowas von egal. Wenn jemand diesen Browser nutzt, dann kann ich ihm nicht helfen... Schlimm genug, dass das Mutter-OS so weit verbreitet ist. Der ist für mich völlig irrelevant und wird auch nicht weiter beachtet.

Naja. Der IE ist immer noch recht weit verbreitet. Ich persoenlich kenne noch viele Leute die den IE z.B. nutzen weil der halt vom Provider geliefert wird und man "sonst ja nicht ins Internet kommt"...

Och. Ich wunder mich schon, warum hier noch keiner seinen Senf dazu beigetragen hat. Im senfen gibts hier Weltmeister. ;)
Ach? Was habe ich denn zu erwarten? Ich kann auch zurücksenfen!

Das ist irgendwie Tagesformabhaengig.

[weltio]

Du erstellst einen Link, der so gross ist, wie eine Grafik. Dann nimmst Du ein Bild mit allen Grafiken fuer die diversen Zustaende des Links als Hintergrundbild. Fertig. Musst nur noch das Hintergrundbild verschieben. Moechtest Du es Barrierefrei, hat der Link einen vernuenftigen Text, der mit CSS ausgeblendet wird. Wie gesagt: Tutorials findest Du reichlich.

Jawoll. Aber wie würdest du das nun mit nem Bild aus ner DB lösen? Also wie sähe das explizit (code?) aus? Ich kann mir im Moment nicht so wirklich was darunter vorstellen, wenn ich ehrlich bin.

Du musst gar nichts auf die Platte schreiben. Du sollst es nur ausliefern.

Wie meinst du? Im Header oder inline oder was meinst du?

Ja natuerlich kannst Du das auch per Inline-Styles erledigen. Ist zwar nicht optimal, aber legitim. Faellt fuer mich genauso unter CSS wie CSS Bereiche im head oder in einer externen Datei...

Klasse, dass du das entscheidest - was hat dich gleich dazu qualifiziert (ich meine das wieder ernst). CSS ist es sowieso. Das heißt noch lange nicht, dass es effizient, optimal und nützlich ist. Sofern es bessere Lösungen gibt, darfst du sie mir gerne nennen.

Naja. Der IE ist immer noch recht weit verbreitet. Ich persoenlich kenne noch viele Leute die den IE z.B. nutzen weil der halt vom Provider geliefert wird und man "sonst ja nicht ins Internet kommt"...

Das ist schön für dieses Produkt. Aber irgendjemand muss ja mit der Revolution anfangen. :D

Das ist irgendwie Tagesformabhaengig.

Mittlerweile sind alle Tagesformen durch oder? :D

[ChrisB]

Hi,

Ja natuerlich kannst Du das auch per Inline-Styles erledigen. Ist zwar nicht optimal, aber legitim. Faellt fuer mich genauso unter CSS wie CSS Bereiche im head oder in einer externen Datei...
Klasse, dass du das entscheidest - was hat dich gleich dazu qualifiziert (ich meine das wieder ernst).

Was qualifiziert dich denn, wenn du bisher eigentlich alle Vorschläge nur als ineffizient, unschön etc. angelehnt hast - ohne dies genauer zu begründen?

MfG ChrisB

[Steel]

Nabend,

Jawoll. Aber wie würdest du das nun mit nem Bild aus ner DB lösen? Also wie sähe das explizit (code?) aus? Ich kann mir im Moment nicht so wirklich was darunter vorstellen, wenn ich ehrlich bin.

Das Bild muss nicht in der DB sein. Was Du brauchst ist eine Quelle für ein CSS und eine Quelle für die zur Verfügung stehenden Bilder. Für n angezeigte Bilder enthaelt das CSS z.B. n Definitionen mit je einem Platzhalter. Mit der serverseitigen Sprache Deiner Wahl baust Du aus der CSS-Vorlage und den Dateinamen das gewuenschte CSS. Gern darf das CSS auch nur einen Platzhalter enthalten, der mit n Styles samt Bildnamen ersetzt wird. Code liefere ich hier nicht. Eine String-Replacementfunktion solltest Du in der Software Deiner Wahl eigentlich finden. Aber natürlich hält Dich niemand davon ab, deine Ideen und Versuche hier zu posten.

Ja natuerlich kannst Du das auch per Inline-Styles erledigen. Ist zwar nicht optimal, aber legitim. Faellt fuer mich genauso unter CSS wie CSS Bereiche im head oder in einer externen Datei...
Klasse, dass du das entscheidest - was hat dich gleich dazu qualifiziert (ich meine das wieder ernst). CSS ist es sowieso. Das heißt noch lange nicht, dass es effizient, optimal und nützlich ist. Sofern es bessere Lösungen gibt, darfst du sie mir gerne nennen.

Was hab ich denn un-/qualifiziert entschieden? Daß Inline-Styles nicht optimal sind?

Inline-Styles ermöglichen dir natürlich die direktere Manipulation. Du brauchst auch nur einmal eine dynamische Datei, nämlich die HTML Datei. Die Dinger sind aber nunmal ziemlich spezifisch (und in diesem Sinne auch gut zu gebrauchen) und könnten Dir irgendwann dein normales CSS versäbeln. Dazu mischt Du unschön Design und Content. Da würde ich einen CSS-Bereich im Header vorziehen. Was natürlich immer noch unschöne 2 Quellen für CSS verursacht, wenn man noch ein externes File benutzt. Das ist meiner Meinung nach aber Dein Problem. Ich muss das ja nicht warten.

Viele CMS haben das CSS Template in der Datenbank. Ein Aufruf der CSS Ressource triggert lediglich ein Script, daß das CSS aus der Datei lädt, eventuell manipuliert und dann ausliefert. Funktioniert wie eine normale CSS Datei. Nur daß dort vielleicht für jede Tageszeit andere Farben definiert sind, wenn man sich das Teil direkt anschaut... Der User oder Browser bekommt davon nichts mit. Er sieht nur CSS Code nachdem er eine 'CSS-Datei' aufgerufen hat. Wo der Inhalt letztlich herkommt ist, wie schon erwähnt, reichlich wurst.

Naja. Der IE ist immer noch recht weit verbreitet. Ich persoenlich kenne noch viele Leute die den IE z.B. nutzen weil der halt vom Provider geliefert wird und man "sonst ja nicht ins Internet kommt"...
Das ist schön für dieses Produkt. Aber irgendjemand muss ja mit der Revolution anfangen. :D

Viel Spaß dabei. Hast Du zur Unterstützung auch einen Sancho Pansa an Deiner Seite?

Das ist irgendwie Tagesformabhaengig.
Mittlerweile sind alle Tagesformen durch oder? :D

Ne. Wir hatten erst die Montagsform und die Dienstagsform. Eventuell sogar nur die 15-. und 16. Märzformen... ;)

[weltio]

Ich habe nun versucht, das ganze mittels clip zu realisieren. Das Problem hierbei ist allerdings, dass das Bild einfach in voller Größe dargestellt wird, "hidden" und "clip" also völlig ignoriert werden. Ist hier also ein syntaktischer Fehler vorhanden?

  
div#pic{  
  width:200px;  
  overflow: hidden;  
  height:170px;  
}  
  
img{  
  position: absolute;  
  clip: rect(0,200,200,0);  
}  
  
img:hover{  
  clip: rect(200,200,400,0);  
}  

[ChrisB]

Hi,

img{
  position: absolute;
  clip: rect(0,200,200,0);

200 was?

MfG ChrisB