في الأمثلة في هذه المقالة ، يمكنك استخدام JS لتحقيق تأثير ارتداد بسيط. لمحتوى محدد ، يرجى الرجوع إلى قسم الرمز.
<! doctype html> <html lang = "en"> <head> <meta charset = "utf-8"> <title> كرة التصادم </title> <style> #box {width: 1000px ؛ الارتفاع: 800 بكسل ؛ الموقف: قريب الحدود: 1 بكسل صلب أحمر. الهامش: 50 بكسل Auto 0 ؛ } #boll {width: 50px ؛ الارتفاع: 50px ؛/* الحدود الحدودية: 25px ؛*/ الحدود: 1 بكسل أخضر صلب ؛ الموقف: مطلق ؛ أعلى: 66 بكسل ؛ اليسار: 88 بكسل ؛ } </style> </head> <body> <div id = "box"> <div id = "boll"> </viv> </viv> <script> var box = document.getElementById ('box') ؛ var boll = document.getElementById ('boll') ؛ var x = 88 ، y = 66 ، timer1 = null ، movex = 1 ، movey = 1 ؛ console.log (box.clientwidth-boll.clientwidth) ؛ console.log (box.clientwidth-boll.offsetwidth) ؛ timer1 = setInterval (function () {if (movex) {// judge direction x ++ ؛ if (x> = box.clientwidth-boll.clientwidth) {movex = 0 ؛} boll.style.left = x+'px' ؛} ell {x 1 ؛ if (x) } if (movey) {y ++ ؛ </script> </body> </html>من بينها ، متغيرات Movex و Movey هي اتجاه الحركة.
ما سبق هو كل محتوى هذه المقالة. آمل أن يكون ذلك مفيدًا لتعلم الجميع وآمل أن يدعم الجميع wulin.com أكثر.