作者热门文章
- iOS/Objective-C 元类和类别
- objective-c - -1001 错误,当 NSURLSession 通过 httpproxy 和/etc/hosts
- java - 使用网络类获取 url 地址
- ios - 推送通知中不播放声音
我设置了一个简单的 div,我想知道如何让它具有“弹出”效果。例如,我希望它从一个较小的矩形开始,然后让它变成一个稍大的矩形,给人一种它突然出现在你面前的错觉。
HTML
<div id="submit-logged-out">
You must be <a href="/wp-login.php?action=register">registered</a> to submit.
</div>
CSS
#submit-logged-out {
background: #000;
color: #fff;
font-size: 2em;
left: 112px;
padding: 40px;
position: absolute;
top: 200px;
}
JSFiddle:http://jsfiddle.net/SSsVx/
最佳答案
最好使用纯 CSS 来完成:
.popout {
animation: popout 1s ease;
-webkit-animation: popout 1s ease;
}
@keyframes popout {
from{transform:scale(0)}
80%{transform:scale(1.2)}
to{transform:scale(1)}
}
@-webkit-keyframes popout {
from{-webkit-transform:scale(0)}
80%{-webkit-transform:scale(1.2)}
to{-webkit-transform:scale(1)}
}
然后只需将 .popout
类添加到您的框中即可。
关于javascript - 如何为这个盒子制作动画以产生弹出效果?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14542429/
我是一名优秀的程序员,十分优秀!