怎么使animate動畫循環(huán)起來呢
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
? ? <head>
? ? ? ? <title>制作移動位置的動畫</title>
? ? ? ? <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
? ? ? ? <link href="style.css" rel="stylesheet" type="text/css" />
? ? </head>
? ??
? ? <body>
? ? ? ? <h3>制作移動位置的動畫</h3>
? ? ? ? <span></span>
? ? ? ? <div id="tip"></div>
? ? ? ??
? ? ? ? <script type="text/javascript">
? ? ? ? ? ? $(function () {
? ? ? ? ? ? ? ? $("span").animate({
? ? ? ? ? ? ? ? ? ? left: "+=100px"
? ? ? ? ? ? ? ? }, 3000, function () {
? ? ? ? ? ? ? ? ? ? $("span").animate({
? ? ? ? ? ? ? ? ? ? ? ? height: '+=30px',
? ? ? ? ? ? ? ? ? ? ? ? width: '+=30px'
? ? ? ? ? ? ? ? ? ? }, 3000, function () {
? ? ? ? ? ? ? ? ? ? ? ? $("#tip").html("執(zhí)行完成!");
? ? ? ? ? ? ? ? ? ? });
? ? ? ? ? ? ? ? });
? ? ? ? ? ? });
? ? ? ? </script>
? ? </body>
</html>
2016-05-18
在函數(shù)外面再加以一個條件if(1)
2016-05-17
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
? ? <head>
? ? ? ? <title>制作移動位置的動畫</title>
? ? ? ? <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
? ? ? ? <link href="style.css" rel="stylesheet" type="text/css" />
? ? </head>
? ??
? ? <body>
? ? ? ? <h3>制作移動位置的動畫</h3>
? ? ? ? <span></span>
? ? ? ? <div id="tip"></div>
? ? ? ??
? ? ? ? <script type="text/javascript">
? ? ? ? ? ? $(function () {
? ? ? ? ? ? ? ? $("span").animate({left: "+=100px"}, 3000, function () {
? ? ? ? ? ? ? ? ? ? $(this).animate({height: '+=30px',width: '+=30px'}, 3000, function ()?
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? {
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?$("#tip").html("執(zhí)行完成!");
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? });
? ? ? ? ? ? ? ? });
? ? ? ? ? ? });
? ? ? ? </script>
? ? </body>
</html>