求解為什么沒效果~
<!DOCTYPE html>
<html>
? ? <head>
? ? ? ? <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
? ? ? ? <title>jQuery動畫特效</title>
? ? ? ? <style type="text/css">
? ? ? ? ? ? div{
? ? ? ? ? ? ? ? border:yellow 2px solid;
? ? ? ? ? ? ? ? background-color:blue;
? ? ? ? ? ? ? ? width:100px;
? ? ? ? ? ? ? ? height:100px;
? ? ? ? ? ? ? ? position:absolute;
? ? ? ? ? ? ? ? left:100px;
? ? ? ? ? ? ? ? top:50px;
? ? ? ? ? ? ? ? margin:0px;
? ? ? ? ? ? }
? ? ? ? </style>
? ? ? ? <script type="text/javascript" src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
? ? ? ??
? ? </head>
? ??
? ? <body>
? ? ? ? <input type="button" value="左移" class="l50" ?/>
? ? ? ? <input type="button" value="右移" class="r50" />
? ? ? ? <div></div>
? ? ? ? <script>
? ? ? ? ? ? $(".l50").bind("click",function(){
? ? ? ? ? ? ? ? $("div").animate({
? ? ? ? ? ? ? ? ? ? right:"+=50px";
? ? ? ? ? ? ? ? },3000,function(){
? ? ? ? ? ? ? ? ? ? $(".l50").attr("disabled",true);
? ? ? ? ? ? ? ? ? ? $("r50").attr("disabled",false);
? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? ? ? )
? ? ? ? ? ? ? ? })
? ? ? ? ? ? ? $(".r50").bind("click",function(){
? ? ? ? ? ? ? ? ? $("div").animate(
? ? ? ? ? ? ? ? ? ? ? {
? ? ? ? ? ? ? ? ? ? ? ? ? left:"+=50px";
? ? ? ? ? ? ? ? ? ? ? },3000,function(){
? ? ? ? ? ? ? ? ? ? ? ? ? $(".r50").attr("disabled",true);
? ? ? ? ? ? ? ? ? ? ? ? ? $(",l50").attr("disabled",false);
? ? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? ? ? ? )
? ? ? ? ? ? ? })
? ? ? ? ? ??
? ? ? ? </script>
? ? ? ??
? ? </body>
</html>
2016-03-03
,function(){
? ? ? ? ? ? ? ? ? ? $(".l50").attr("disabled",true);
? ? ? ? ? ? ? ? ? ? $("r50").attr("disabled",false);
? ? ? ? ? ? ? ? }
這段不要。right:"+=50px";改為:left:"+=50px"
left:"+=50px";改為:left:"-=50px";方向要一致
你試一試吧