重力效果v1.0

 主要代码：

View Code

 1  function gravity() {
 2      this.init();
 3      this.speedY = 0;
 4      this.clientY =  this.getViewport().height;
 5 }
 6 gravity.prototype = {
 7     init:  function () {
 8          var newDiv = document.createElement("div");
 9         newDiv.id = "box";
10          var newImg = document.createElement("img");
11         newImg.src = "apple.png";
12         newDiv.appendChild(newImg);
13         document.body.appendChild(newDiv);
14 
15          var _this =  this;
16          this.addHandler(newDiv, "click",  function () {
17             setInterval( function () { _this.shake(newDiv) }, 30);
18         });
19     },
20 
21     shake:  function (oBox) {
22          this.speedY += 2;
23          var t = oBox.offsetTop +  this.speedY;
24          if (t >  this.clientY - oBox.offsetHeight) {
25             t =  this.clientY - oBox.offsetHeight;
26              this.speedY *= -1;
27              this.speedY *= 0.75;
28              this.speedY = Math.round( this.speedY);
29         }
30          else  if (t < 0) {
31             t = 0;
32              this.speedY *= -1;
33              this.speedY *= 0.75;
34              this.speedY = Math.round( this.speedY);
35         }
36         oBox.style.top = t + 'px'
37     },
38     getViewport:  function () {
39          if (document.compatMode == "BackCompat") {
40              return {
41                 width: document.body.clientWidth,
42                 height: document.body.clientHeight
43             };
44         }
45          else {
46              return {
47                 width: document.documentElement.clientWidth,
48                 height: document.documentElement.clientWidth
49             };
50         }
51     },
52     addHandler:  function (element, type, handler) {
53          if (element.addEventListener) {
54             element.addEventListener(type, handler,  false);
55         }
56          else  if (element.attachEvent) {
57             element.attachEvent("on" + type, handler);
58         }
59          else {
60             element["on" + type] = handler;
61         }
62     },
63 
64     removeHandler:  function (element, type, handler) {
65          if (element.removeEventListener) {
66             element.removeEventListener(type, handler,  false);
67         }
68          else  if (element.detachEvent) {
69             element.detachEvent("on" + type, handler);
70         }
71          else {
72             element["on" + type] =  null;
73         }
74     }
75 }

 

/Files/MasterHeng/重力效果.zip

转载于:https://www.cnblogs.com/MasterHeng/archive/2011/11/28/2266106.html