ja bym zrobił coś takiego:
--- div który będzie robił za kontenera (z ustawioną klasą np. "outer")
------------ div wewnętrzny
------------ drugi div wewnętrzny (ten który ma się pokazać po najechaniu)
- przy czym div zewnętrzny niech ma ustawioną stałą szerokość i wysokość (np. 200px na 200px) i overflow:hidden. Div zewnętrzny będzie takim kontenerem-oknem, przez które będziemy patrzeć na divy w środku.
- wysokość i szerokość divów wewnętrznych jest taka sama jak wymiary diva-kontenera, tym sposobem tylko pierwszy z divów będzie widoczny, a drugi się ukryje (ponieważ daliśmy overflow:hidden).
- za pomocą CSSa dodajemy deklarację
Kod
.outer:hover :first-child {
margin-top: -200px;
}
minus 200px dlatego że wysokość kontenera ustawiliśmy na 200px.
- oraz dodajemy odpowiednie CSS transitions
efekt - taki jak tutaj:
http://jsfiddle.net/d3CqE/