联动动画
Posted zhangzhengyang
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了联动动画相关的知识，希望对你有一定的参考价值。
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 <style> 7 * 8 margin: 0; 9 padding: 0; 10 11 12 img 13 vertical-align: top; 14 15 16 #box 17 position: fixed; 18 right: 0; 19 bottom: 0; 20 21 22 #close 23 width: 25px; 24 height: 25px; 25 background-color: transparent; 26 position: absolute; 27 right: 0; 28 top: 0; 29 cursor: pointer; 30 31 32 </style> 33 </head> 34 <body> 35 <div id="box"> 36 <span id="close"></span> 37 <div id="top"> 38 <img src="images/top.jpg" > 39 </div> 40 <div id="bottom"> 41 <img src="images/bottom.jpg" > 42 </div> 43 </div> 44 <script src="js/MyTool.js"></script> 45 <script> 46 window.addEventListener(‘load‘, function (ev) 47 myTool.$(‘close‘).addEventListener(‘click‘, function () 48 myTool.buffer(myTool.$(‘bottom‘), ‘height‘: 0, function () 49 myTool.buffer(myTool.$(‘box‘), ‘width‘: 0, function () 50 myTool.$(‘close‘).style.display = ‘none‘; 51 ) 52 ) 53 ); 54 ); 55 </script> 56 </body> 57 </html>
以上是关于联动动画的主要内容，如果未能解决你的问题，请参考以下文章