案例:原生JS實現360開機動畫
阿新 • • 發佈:2018-12-20
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> .box { width: 322px; position: fixed; bottom: 0; right: 0; overflow: hidden; } span { position: absolute; top: 0; right: 0; width: 30px; height: 20px; cursor: pointer; } </style> </head> <body> <div class="box" id="box"> <span id="closeButton"></span> <div class="hd" id="headPart"> <img src="images/t.jpg" alt=""/> </div> <div class="bd" id="bottomPart"> <img src="images/b.jpg" alt=""/> </div> </div> <script src="common.js"></script> <script> my$("closeButton").onclick=function () { animate(document.getElementById("bottomPart"),{"height":0},function () { animate(document.getElementById("box"),{"width":0}) }) }; </script> <!--<script>--> <!--my$("closeButton").onclick=function () {--> <!--//設定最下面的div的高漸漸的變成0--> <!--animate(my$("bottomPart"),{"height":0},function () {--> <!--animate(my$("box"),{"width":0});--> <!--});--> <!--};--> <!--</script>--> </body> </html>