運(yùn)行不粗來(lái)??
<!DOCTYPE html>
<html>
??? <head>
??????? <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
??????? <title>jQuery動(dòng)畫(huà)特效</title>
??????? <style type="text/css">
??????????? div{
??????????????? width:100px;
??????????????? height:100px;
??????????????? border:red solid 2px;
??????????????? background-color:green;
??????????????? position:absolute;
??????????????? margin:10px 200px;
??????????????? }
??????? </style>
??? </head>
?? ?
??? <body>
??? <div id="box"></div>
?? ?
??? <input type="button"? id="zuo" value="左移"/>
??? <input type="button"? id="you" value="右移"/>
??? <script type="text/javascript" src="http://libs.baidu.com/jquery/1.9.0/jquery.js">
??????? $(function(){
??????????? $("#zuo").bind("click",function(){
??????????????? $("#box").animate(? {left: "+=100px"},2000)
??????????? })
??????????? $("#you").bind("click",function(){
??????????????? $("#box").animate(? {left: "-=100px"},2000)
??????????? })
??????? })
??? </script>
??? </body>
</html>
-------------------------------------------------------------------------------------------------
我的代碼,怎么沒(méi)效果呢?
2016-05-19
<!DOCTYPE html>
<html>
? ? <head>
? ? ? ? <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
? ? ? ? <title>jQuery動(dòng)畫(huà)特效</title>
? ? ? ? <style type="text/css">
? ? ? ? ? ? div{
? ? ? ? ? ? ? ? width:100px;
? ? ? ? ? ? ? ? height:100px;
? ? ? ? ? ? ? ? border:red solid 2px;
? ? ? ? ? ? ? ? background-color:green;
? ? ? ? ? ? ? ? position:absolute;
? ? ? ? ? ? ? ? margin:10px 200px;
? ? ? ? ? ? ? ? }
? ? ? ? </style>
? ? </head>
? ??
? ? <body>
? ? <div id="box"></div>
? ??
? ? <input type="button" ?id="zuo" value="左移"/>
? ? <input type="button" ?id="you" value="右移"/>
? ? <script type="text/javascript" src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>//這是引入的腳本,不能在這里面編寫(xiě)代碼
? ? <script>
? ? ? ? $(function(){
? ? ? ? ? ? $("#zuo").bind("click",function(){
? ? ? ? ? ? ? ? $("#box").animate({left:"100px"},2000)
? ? ? ? ? ? })
? ? ? ? ? ? $("#you").bind("click",function(){
? ? ? ? ? ? ? ? $("#box").animate({left:"100px"},2000)
? ? ? ? ? ? })
? ? ? ? })
? ? </script>
? ? </body>
</html>
2016-05-19
加載jQuuery應(yīng)該放在<head/>里面,
<head><script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script</head>
,還有你左移是“-=”,右移是“+=”才對(duì)