CSS过渡从右移动图像

CSS过渡从右移动图像

问题描述:

我有一个有趣的情况,我想知道如果我可以用CSS过渡解决。CSS过渡从右移动图像

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

您可以看到,当您将鼠标悬停在标题栏上时,文本框和图像会移动。

但是,这是通过将X背景位置设置为高于100%来完成的,这使得事情变得有点精神!尝试调整浏览器宽度以查看我的意思。

您可以从左侧进行此操作 - 请参阅此jsfiddle,但我无法想象从右侧的CSS方式。

我在想这可以在将来完成calc()

任何想法?

内导航添加一个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