В примерах в этой статье вы можете использовать JS для достижения простого эффекта отскока. Для конкретного контента, пожалуйста, обратитесь к разделу кода.
<! Doctype html> <html lang = "en"> <head> <meta charset = "UTF-8"> <Title> Collision Ball </title> <style> #box {ширина: 1000px; Высота: 800px; позиция: относительно; Граница: 1px твердый красный; Маржа: 50px Auto 0; } #boll {width: 50px; Высота: 50px;/* граница-радиус: 25px;*/ граница: 1px твердый зеленый; позиция: абсолютно; Верх: 66px; Слева: 88px; } </style> </head> <body> <div id = "box"> <div id = "boll"> </div> </div> <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) {// Судья направление x ++; if (x> = box.clientwidth-boll.clientwidth) {movex = 0;} boll.style.left = x+'px';} else {x--; if (x <= 0) {movex = 1;} boll.sty.sty. } if (movey) {y ++; </script> </body> </html>Среди них переменные перемещения и движения являются направлением движения.
Выше всего содержание этой статьи. Я надеюсь, что это будет полезно для каждого обучения, и я надеюсь, что все будут поддерживать Wulin.com больше.