jquery详解animate方法
时间:6年前 阅读:5663
1、animate是jquery的一个方法,这个方法主要功能是能实现比较平滑的动态效果,所以你想做一个简单又不失美观的动态效果不如试试它,下面举个例子
Bash
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
#tt{
position: absolute;
/*left: 0px;*/
top: 100px;
}
</style>
<script src="../js/jquery-1.11.3.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$('#dd').click(function(){
// animate 动画; {'left':'600px'}开始走600px, 走3000 linear:走的状态(匀速运动)一般我们用变速运动比较多,匀速运动看起来视觉不舒服
// $('#tt').animate({'left':'600px'},3000,'linear');
$('#tt').animate({'left':'600px'},3000,function(){
// function这里是回调函数,走完这个动画,再执行函数内容
alert('到了,走了600px');
});
})
})
</script>
</head>
<body>
<input type="button" name="dd" id="dd" value="一点就跑!" />
<br /><br />
<img src="https://www.qiquanji.com/data/img/dmj/201903141552521811146879.gif" alt="" id="tt" style="left: 0px;"/>
</body>
</html>
本站声明:网站内容来源于网络,如有侵权,请联系我们https://www.qiquanji.com,我们将及时处理。

微信扫码关注
更新实时通知
网友评论