Ich habe den folgenden Code:
%Vor%Sehen Sie es in Aktion: Ссылка
Wenn eine div-ID schwebte, sollte sie sich erweitern, ohne andere divs zu verschieben. Ссылка
Bitte schlagen Sie auch vor, wie Sie eine browserübergreifende Lösung erreichen können.
Wenn es mit reinem CSS gemacht werden kann, bevorzuge ich diese Lösung.
Wenn nicht, kann jquery auf einfache Weise ohne Plugins verwendet werden?
Sehen Sie sich diese Demo an: Ссылка
HTML:
%Vor%CSS:
%Vor% Jedes .item ist jetzt relativ positioniert und hat ein neues Kind, das den gesamten Inhalt umschließt. Sobald div schwebt, wird .item s overflow:hidden in overflow:visible geändert und z-index von .inner wird auf 100 gesetzt (um es über anderen divs zu zeigen).
UPD : Neuer Demo und aktualisierter Code. Für IE7 (z-Index wird für .item: hover geändert, andernfalls ist das innere div unter anderem .item s in IE7 verborgen)
Sie können child selector element verwenden, indem Sie ein weiteres div mit der Klasse hinzufügen, die Sie auswählen möchten. Hier ist Ihr Code, der unten aktualisiert wird. Hoffe das hilft!
%Vor%
Sie können den aktualisierten Code hier vorstellen: Ссылка
UPDATE: Sie müssen nicht einmal child selector element verwenden, stattdessen können Sie es einfach in :hover ändern, indem Sie .item:hover >.item-extend mit .item-extend:hover ausschalten. Funktioniert genau so.
Sie benötigen ein extra div, um ein absolutes darin zu halten.
HTML
%Vor%item ist absolut und itemHolder schwebt.
CSS
%Vor%Live-Lösung hier: Ссылка
:)
Sie können es mit wenig Javascript erreichen. Siehe unten,
%Vor%DEMO: Ссылка
Hinweis: Überprüfen Sie andere CSS-basierte Antworten, was immer besser ist, als dies über Skripte zu erreichen.