首页 > 代码库 > 左右摇摆
左右摇摆
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style> 7 * 8 { 9 margin: 0;10 padding: 0;11 }12 #z_d1,#z_d213 {14 width: 300px;15 height: 300px;16 background: pink;17 }18 </style>19 </head>20 <body>21 <input type="button" value="我是摇摆哥" id="z_inp1">22 <div id="z_d1"></div>23 <input type="button" value="+" id="z_inp2">24 <div id="z_d2"></div>25 26 <!-- =====================JS========================-->27 <script>28 var z_inp1=document.getElementById(‘z_inp1‘);29 var z_d1=document.getElementById(‘z_d1‘);30 var z_inp2=document.getElementById(‘z_inp2‘);31 var z_d2=document.getElementById(‘z_d2‘);32 var a=1,b=0;33 //左右摇摆34 z_inp1.onclick=function() {35 if (a==1) {36 z_d1.style.marginLeft="10px";37 a=0;38 }else{39 z_d1.style.marginLeft="-10px";40 a=1;41 };42 };43 44 //无限+ 45 z_inp2.onclick=function(){46 b+=10;47 z_d2.style.marginLeft=b+"px"; 48 };49 50 </script>51 </body>52 </html>
左右摇摆
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。