2012-02-14 129 views
2

我有一個有趣的情況,我想知道如果我可以用CSS過渡解決。CSS過渡從右移動圖像

描述它的最好方法是看看jsfiddle

您可以看到,當您將鼠標懸停在標題欄上時,文本框和圖像會移動。

但是,這是通過將X背景位置設置爲高於100%來完成的,這使得事情變得有點精神!嘗試調整瀏覽器寬度以查看我的意思。

您可以從左側進行此操作 - 請參閱此jsfiddle,但我無法想象從右側的CSS方式。

我在想這可以在將來完成calc()

任何想法?

回答

0

內導航添加一個div作爲小貓背景掛鉤,浮動的權利和動畫寬度上懸停......有了它的工作原理有點扭捏..

http://jsfiddle.net/RuEGv/7/

+0

大小提琴,但不完全按照自己的意願去做。我希望圖像能夠滑入。我想我已經想出了另一種方式,但需要一個特殊的圖像 – 2012-02-14 17:11:46

+0

如果你想要整個圖像滑動,那麼除了在絕對位置移動整個div時第一個地方..我想這個錯誤是由於這樣的事實,當你調整瀏覽器窗口的大小不知何故背景位置的百分比是基於原來的視口大小,從而miscalculating? – 2012-02-15 08:56:36

+0

是的設置百分比值超出0-100似乎做了一些精神上的事情。 – 2012-02-21 11:48:21