js窗口震动小程序分享

论坛 期权论坛 期权     
Java   2019-6-16 05:17   3836   0
窗口震动的应用是很常见的,比如最常用的聊天软件qq,就有一个窗口抖动,还有在填表单时的出错提醒,所以自己也写了个很简单的示例,以下是具体的代码



窗口震动







var loop = 0; //统计震动次数
var timer; //定时器引用
var offx; //水平偏移量
var offy; //垂直偏移量
var dir; //控制震动方向

timer = setInterval(function(){
  var win = document.getElementById("win");
  if (loop > 100)
  {
   clearInterval(timer); //震动次数超过100就停止定时器
  }
  dir = Math.random()*10 > 5 ? 1 : -1; //获得震动方向
  offx = Math.random()*20*dir;
  offy = Math.random()*20*dir;
  win.style.marginTop = 200+offx+"px";
  win.style.marginLeft = 600+offy+"px";
  loop++;
},10) //每隔10毫秒震动一次


在代码中主要就是利用随机数来控制抖动的方向和范围,还有用setInterval函数来设置抖动的频率,以及loop变量设置一次抖动的次数。自己可以根据实际需求来设置抖动的频率,范围,和次数。
微信公众号|javabaiwen
小编微信号|646448081
关注JAVA公众号,轻松获取海量资源、最新资讯、粉丝福利等等等等
长按二维码关注我们
分享到 :
0 人收藏
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

积分:2
帖子:8
精华:0
期权论坛 期权论坛
发布
内容

下载期权论坛手机APP