多次向左移動后,走到了瀏覽器外邊怎么辦?
<!DOCTYPE html>
<html>
? ? <head>
? ? ? ? <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
? ? ? ? <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
? ? ? ? <title>jQuery動畫特效</title>
? ? ? ? <style type="text/css">
? ? ? ? div{
? ? ? ? width: 30px;
? ? ? ? height: 30px;
? ? ? ? border: 1px solid #999;
? ? ? ? border-radius: 50%;
? ? ? ? background-color: orange;
? ? ? ? position: absolute;
? ? ? ? left: 100px;
? ? ? ? }
? ? ? ? input{
? ? ? ? margin-top: 60px;
? ? ? ? margin-left: 40px;
? ? ? ? }
? ? ? ? </style>
? ? </head>
? ??
? ? <body>
? ? ? ? <div></div>
? ? ? ??
? ? ? ? <input type="button" value="左移" id="left">
? ? ? ? <input type="button" value="右移" id="right">
? ? ? ? <span></span>
? ? ? ? <script type="text/javascript">
? ? ? ? $(function(){
? ? ? ? $("#left").bind('click',function(){
? ? ? ? $("div").animate({
? ? ? ? left:'-=50px'
? ? ? ? },3000,function(){
? ? ? ? $("span").html("左移50像素");
? ? ? ? });
? ? ? ? });
? ? ? ? $("#right").bind('click',function(){
? ? ? ? $("div").animate({
? ? ? ? left:'+=100px'
? ? ? ? },3000,function(){
? ? ? ? $("span").html("右移100像素");
? ? ? ? });
? ? ? ? });
? ? ? ? })
? ? ? ? </script>
? ? </body>
</html>
2016-03-28
先left:'+=50px;'再left:'-=50px;',出去了就不讓它出去唄