Native js achieves jitter similar to pop-up window _ javascript skills

This article mainly introduces information about how native js achieves jitter similar to pop-up windows. we recommend it to you. if you need it, you can refer to the jitter window that you have previously created.

  
   Document  Script window. onload = function () {// Obtain the random number function getRandNumber (rmin, rmax) of 0--255 {var cha = rmax-rmin; var rand = Math. random (); return rmin + Math. round (cha * rand)} var placement = document. getElementById ('dv ') var oDv2 = document. getElementById ('dv2') // an array of values to be obtained for jitter var arr = []; // setInterval (function () {var arr2 = [getRandNumber (0,255 ), getRandNumber (0,255), getRandNumber (0,255)]; random. style. B AckgroundColor = "rgb (" + arr2 [0] + "," + arr2 [1] + "," + arr2 [2] + ")"}, 130) // Obtain the jitter value in the array for (var I = 20; I> 0; I-= 2) {arr. push (I,-I)} // shake the first box. onclick = function () {sb (lag, 'left', function () {sb (lag, 'top')} // The second box jitters oDv2.onclick = function () {sb (oDv2, 'left', function () {sb (oDv2, 'top')} // jitter function sb (obj, attr, fnEnd) {var timer = null; var num = 0; clearInterval (timer) timer = setInterval (function () {obj. Style [attr] = parseInt (getStyle (obj, attr) + arr [num] + 'px 'Num ++; if (num = arr. length) {clearInterval (timer) fnEnd & fnEnd () obj. innerHTML = 'I am + getStyle (obj, 'backgroundcolor') + 'color' // alert (1) },50)} function getStyle (obj, attr) {return obj. currentStyle? Obj. currentStyle [attr]: getComputedStyle (obj) [attr] }}; script  
Click me
  
Click me

Demo diagram:

The above is all the content of this article. I hope you will like it.