[英]How to get a flip effect on a div
I want to get like a jQuery UI effect that flips a div. 我想要像翻转div的jQuery UI效果。
An example would be clicking "forgot password" on this site: https://drive.jolicloud.com/welcome 一个示例是单击以下站点上的“忘记密码”: https : //drive.jolicloud.com/welcome
You will notice the whole signup div flips to the back of it. 您会注意到整个注册div翻转到它的背面。
How would I achieve this effect? 我将如何达到这种效果?
Not sure if this should qualify as an answer or comment, but check out http://lab.smashup.it/flip/ . 不知道这是否可以作为答案或评论,但请查看http://lab.smashup.it/flip/ 。 I think the amount of code required to create a cross browser flipping effect is a little too much to ask without trying yourself and getting close
我认为,创建跨浏览器翻转效果所需的代码量太多了,而无需亲自尝试就可以问清楚
为了获得非常简单而原始的翻转效果,您可以将宽度设置为零,将内容交换,然后将宽度设置为原始值。
This is a simple animation using CSS 这是使用CSS的简单动画
http://davidwalsh.name/css-flip http://davidwalsh.name/css-flip
Basically you create a front and back div in a container. 基本上,您可以在容器中创建前和后div。 Rotate the back one 180 degrees over the Y axis.
将后背绕Y轴旋转180度。 When you want to flip, you rotate the container 180 degrees.
要翻转时,可以将容器旋转180度。 Add smooth transition and your done.
添加平滑过渡,然后完成。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.