弹力球案例
Posted luyuandatabase
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了弹力球案例相关的知识，希望对你有一定的参考价值。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>弹力球案例</title> <style> * margin: 0px; padding: 0px; #imgid width: 128px; height: 128px; position: absolute; top: 0px; left: 0px #imgid img width: 128px; height: 128px; </style> </head> <body> <div id="imgid"> <img src="img/Basketball.png" alt="#"> </div> <script> imgdemo=document.getElementById(‘imgid‘); screenHeight=document.documentElement.clientHeight;//可视区域的高 screenWidth=document.documentElement.clientWidth;//可视区域的宽 imgheight=128;//图片的高 imgWidth=128;//图片的宽 Height=screenHeight-imgheight;//差值 Width=screenWidth-imgWidth; ys=0;//初始值 yv=10;//变化值 xs=0; xv=10; //设置一个定时器 setInterval(function() //y轴 ys+=yv;//每10毫秒相加 if(ys>=Height) ys=Height; yv=-yv;//设置yv为负值 if(ys<=0) yv=-yv;//到顶端时设置为正值 //x轴 xs+=xv; if(xs>=Width) xs=Width; xv=-xv; if(xs<=0) xv=-xv; imgdemo.style.top=ys+‘px‘; imgdemo.style.left=xs+‘px‘; document.title=ys+"-"+xs; ,10); </script> </body> </html>
基于Sublime
以上是关于弹力球案例的主要内容，如果未能解决你的问题，请参考以下文章