效果顯示不全
<!DOCTYPE html>
<html>
??? <head>
??????? <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
??????? <title>jQuery動畫特效</title>
??????? <style type="text/css">
??????????? div{
??????????????? background-color:red;
??????????????? width:100px;
??????????????? height:100px;
??????????? }
??????? </style>
??????? <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
??? </head>
?? ?
??? <body>
??????????? <div></div>
??????????? <input type="button" id="left" value="左移">
??????????? <input type="button"? id="right" value="右移">
??????????? <script type="text/javascript">
?????????????? $(function(){
?????????????????? $("#left").bind("click",function(){
?????????????????????????? $("div").animate({
??????????????????????????? left:"-=50px"
??????????????????????? },500,function(){
??????????????????????????? $(this).html("我左移了") ; ?
??????????????????????? })
?????????????????? });
?????????????????? $("#right").bind("click",function(){
??????????????????????? $("div").animate({
?????????????????????????? left:"+=50px"
??????????????????????? },500,function(){
??????????????????????????? $(this).html("我右移了");
??????????????????????? })
?????????????????? });
?????????????? });
??????????? </script>
??? </body>
</html>
會出現(xiàn)我左移了 我右移了的HTML 但是不會動
這是為什么呢
2016-04-08
css代碼里少了div{?position:relative;}