SnowFall

Snow Fall by Rainbow Arch

此脚本不应直接安装,它是一个供其他脚本使用的外部库。如果您需要使用该库,请在脚本元属性加入:// @require https://update.gf.qytechs.cn/scripts/4769/15928/SnowFall.js

  1. /*
  2. DHTML Snowstorm! OO-style Jascript-based Snow effect
  3. ----------------------------------------------------
  4. Version 1.4.20091115 (Previous rev: v1.3.20081215)
  5. Code by Scott Schiller - http://schillmania.com
  6. ----------------------------------------------------
  7. Initializes after body onload() by default (via addEventHandler() call at bottom.)
  8. To customize properties, edit below or override configuration after this script
  9. has run (but before body.onload), eg. snowStorm.snowStick = false;
  10.  
  11. */
  12.  
  13. var snowStorm = null;
  14.  
  15. function SnowStorm() {
  16.  
  17. // --- PROPERTIES ---
  18.  
  19. this.flakesMax = 128; // Limit total amount of snow made (falling + sticking)
  20. this.flakesMaxActive = 64; // Limit amount of snow falling at once (less = lower CPU use)
  21. this.animationInterval = 33; // Theoretical "miliseconds per frame" measurement. 20 = fast + smooth, but high CPU use. 50 = more conservative, but slower
  22. this.flakeBottom = null; // Integer for Y axis snow limit, 0 or null for "full-screen" snow effect
  23. this.targetElement = null; // element which snow will be appended to (document body if null/undefined) - can be an element ID string, or a DOM node reference
  24. this.followMouse = true; // Snow will change movement with the user's mouse
  25. this.snowColor = '#fff'; // Don't eat (or use?) yellow snow.
  26. this.snowCharacter = '•'; // • = bullet, · is square on some systems etc.
  27. this.snowStick = true; // Whether or not snow should "stick" at the bottom. When off, will never collect.
  28. this.useMeltEffect = true; // When recycling fallen snow (or rarely, when falling), have it "melt" and fade out if browser supports it
  29. this.useTwinkleEffect = false; // Allow snow to randomly "flicker" in and out of view while falling
  30. this.usePositionFixed = false; // true = snow not affected by window scroll. may increase CPU load, disabled by default - if enabled, used only where supported
  31.  
  32. // --- less-used bits ---
  33.  
  34. this.flakeLeftOffset = 0; // amount to subtract from edges of container
  35. this.flakeRightOffset = 0; // amount to subtract from edges of container
  36. this.flakeWidth = 8; // max pixel width for snow element
  37. this.flakeHeight = 8; // max pixel height for snow element
  38. this.vMaxX = 5; // Maximum X velocity range for snow
  39. this.vMaxY = 4; // Maximum Y velocity range
  40. this.zIndex = 3; // CSS stacking order applied to each snowflake
  41.  
  42. // --- End of user section ---
  43.  
  44. // jslint global declarations
  45. /*global window, document, navigator, clearInterval, setInterval */
  46.  
  47. var addEvent = (typeof(window.attachEvent)=='undefined'?function(o,evtName,evtHandler) {
  48. return o.addEventListener(evtName,evtHandler,false);
  49. }:function(o,evtName,evtHandler) {
  50. return o.attachEvent('on'+evtName,evtHandler);
  51. });
  52.  
  53. var removeEvent = (typeof(window.attachEvent)=='undefined'?function(o,evtName,evtHandler) {
  54. return o.removeEventListener(evtName,evtHandler,false);
  55. }:function(o,evtName,evtHandler) {
  56. return o.detachEvent('on'+evtName,evtHandler);
  57. });
  58.  
  59. function rnd(n,min) {
  60. if (isNaN(min)) {
  61. min = 0;
  62. }
  63. return (Math.random()*n)+min;
  64. }
  65.  
  66. function plusMinus(n) {
  67. return (parseInt(rnd(2),10)==1?n*-1:n);
  68. }
  69.  
  70. var s = this;
  71. var storm = this;
  72. this.timers = [];
  73. this.flakes = [];
  74. this.disabled = false;
  75. this.active = false;
  76.  
  77. var isIE = navigator.userAgent.match(/msie/i);
  78. var isIE6 = navigator.userAgent.match(/msie 6/i);
  79. var isOldIE = (isIE && (isIE6 || navigator.userAgent.match(/msie 5/i)));
  80. var isWin9X = navigator.appVersion.match(/windows 98/i);
  81. var isiPhone = navigator.userAgent.match(/iphone/i);
  82. var isBackCompatIE = (isIE && document.compatMode == 'BackCompat');
  83. var noFixed = ((isBackCompatIE || isIE6 || isiPhone)?true:false);
  84. var screenX = null;
  85. var screenX2 = null;
  86. var screenY = null;
  87. var scrollY = null;
  88. var vRndX = null;
  89. var vRndY = null;
  90. var windOffset = 1;
  91. var windMultiplier = 2;
  92. var flakeTypes = 6;
  93. var fixedForEverything = false;
  94. var opacitySupported = (function(){
  95. try {
  96. document.createElement('div').style.opacity = '0.5';
  97. } catch (e) {
  98. return false;
  99. }
  100. return true;
  101. })();
  102. var docFrag = document.createDocumentFragment();
  103. if (s.flakeLeftOffset === null) {
  104. s.flakeLeftOffset = 0;
  105. }
  106. if (s.flakeRightOffset === null) {
  107. s.flakeRightOffset = 0;
  108. }
  109.  
  110. this.meltFrameCount = 20;
  111. this.meltFrames = [];
  112. for (var i=0; i<this.meltFrameCount; i++) {
  113. this.meltFrames.push(1-(i/this.meltFrameCount));
  114. }
  115.  
  116. this.randomizeWind = function() {
  117. vRndX = plusMinus(rnd(s.vMaxX,0.2));
  118. vRndY = rnd(s.vMaxY,0.2);
  119. if (this.flakes) {
  120. for (var i=0; i<this.flakes.length; i++) {
  121. if (this.flakes[i].active) {
  122. this.flakes[i].setVelocities();
  123. }
  124. }
  125. }
  126. };
  127.  
  128. this.scrollHandler = function() {
  129. // "attach" snowflakes to bottom of window if no absolute bottom value was given
  130. scrollY = (s.flakeBottom?0:parseInt(window.scrollY||document.documentElement.scrollTop||document.body.scrollTop,10));
  131. if (isNaN(scrollY)) {
  132. scrollY = 0; // Netscape 6 scroll fix
  133. }
  134. if (!fixedForEverything && !s.flakeBottom && s.flakes) {
  135. for (var i=s.flakes.length; i--;) {
  136. if (s.flakes[i].active === 0) {
  137. s.flakes[i].stick();
  138. }
  139. }
  140. }
  141. };
  142.  
  143. this.resizeHandler = function() {
  144. if (window.innerWidth || window.innerHeight) {
  145. screenX = window.innerWidth-(!isIE?16:2)-s.flakeRightOffset;
  146. screenY = (s.flakeBottom?s.flakeBottom:window.innerHeight);
  147. } else {
  148. screenX = (document.documentElement.clientWidth||document.body.clientWidth||document.body.scrollWidth)-(!isIE?8:0)-s.flakeRightOffset;
  149. screenY = s.flakeBottom?s.flakeBottom:(document.documentElement.clientHeight||document.body.clientHeight||document.body.scrollHeight);
  150. }
  151. screenX2 = parseInt(screenX/2,10);
  152. };
  153.  
  154. this.resizeHandlerAlt = function() {
  155. screenX = s.targetElement.offsetLeft+s.targetElement.offsetWidth-s.flakeRightOffset;
  156. screenY = s.flakeBottom?s.flakeBottom:s.targetElement.offsetTop+s.targetElement.offsetHeight;
  157. screenX2 = parseInt(screenX/2,10);
  158. };
  159.  
  160. this.freeze = function() {
  161. // pause animation
  162. if (!s.disabled) {
  163. s.disabled = 1;
  164. } else {
  165. return false;
  166. }
  167. for (var i=s.timers.length; i--;) {
  168. clearInterval(s.timers[i]);
  169. }
  170. };
  171.  
  172. this.resume = function() {
  173. if (s.disabled) {
  174. s.disabled = 0;
  175. } else {
  176. return false;
  177. }
  178. s.timerInit();
  179. };
  180.  
  181. this.toggleSnow = function() {
  182. if (!s.flakes.length) {
  183. // first run
  184. s.start();
  185. } else {
  186. s.active = !s.active;
  187. if (s.active) {
  188. s.show();
  189. s.resume();
  190. } else {
  191. s.stop();
  192. s.freeze();
  193. }
  194. }
  195. };
  196.  
  197. this.stop = function() {
  198. this.freeze();
  199. for (var i=this.flakes.length; i--;) {
  200. this.flakes[i].o.style.display = 'none';
  201. }
  202. removeEvent(window,'scroll',s.scrollHandler);
  203. removeEvent(window,'resize',s.resizeHandler);
  204. if (!isOldIE) {
  205. removeEvent(window,'blur',s.freeze);
  206. removeEvent(window,'focus',s.resume);
  207. }
  208. };
  209.  
  210. this.show = function() {
  211. for (var i=this.flakes.length; i--;) {
  212. this.flakes[i].o.style.display = 'block';
  213. }
  214. };
  215.  
  216. this.SnowFlake = function(parent,type,x,y) {
  217. var s = this;
  218. var storm = parent;
  219. this.type = type;
  220. this.x = x||parseInt(rnd(screenX-20),10);
  221. this.y = (!isNaN(y)?y:-rnd(screenY)-12);
  222. this.vX = null;
  223. this.vY = null;
  224. this.vAmpTypes = [1,1.2,1.4,1.6,1.8]; // "amplification" for vX/vY (based on flake size/type)
  225. this.vAmp = this.vAmpTypes[this.type];
  226. this.melting = false;
  227. this.meltFrameCount = storm.meltFrameCount;
  228. this.meltFrames = storm.meltFrames;
  229. this.meltFrame = 0;
  230. this.twinkleFrame = 0;
  231. this.active = 1;
  232. this.fontSize = (10+(this.type/5)*10);
  233. this.o = document.createElement('div');
  234. this.o.innerHTML = storm.snowCharacter;
  235. this.o.style.color = storm.snowColor;
  236. this.o.style.position = (fixedForEverything?'fixed':'absolute');
  237. this.o.style.width = storm.flakeWidth+'px';
  238. this.o.style.height = storm.flakeHeight+'px';
  239. this.o.style.fontFamily = 'arial,verdana';
  240. this.o.style.overflow = 'hidden';
  241. this.o.style.fontWeight = 'normal';
  242. this.o.style.zIndex = storm.zIndex;
  243. docFrag.appendChild(this.o);
  244.  
  245. this.refresh = function() {
  246. if (isNaN(s.x) || isNaN(s.y)) {
  247. // safety check
  248. return false;
  249. }
  250. s.o.style.left = s.x+'px';
  251. s.o.style.top = s.y+'px';
  252. };
  253.  
  254. this.stick = function() {
  255. if (noFixed || (storm.targetElement != document.documentElement && storm.targetElement != document.body)) {
  256. s.o.style.top = (screenY+scrollY-storm.flakeHeight)+'px';
  257. } else if (storm.flakeBottom) {
  258. s.o.style.top = storm.flakeBottom+'px';
  259. } else {
  260. s.o.style.display = 'none';
  261. s.o.style.top = 'auto';
  262. s.o.style.bottom = '0px';
  263. s.o.style.position = 'fixed';
  264. s.o.style.display = 'block';
  265. }
  266. };
  267.  
  268. this.vCheck = function() {
  269. if (s.vX>=0 && s.vX<0.2) {
  270. s.vX = 0.2;
  271. } else if (s.vX<0 && s.vX>-0.2) {
  272. s.vX = -0.2;
  273. }
  274. if (s.vY>=0 && s.vY<0.2) {
  275. s.vY = 0.2;
  276. }
  277. };
  278.  
  279. this.move = function() {
  280. var vX = s.vX*windOffset;
  281. s.x += vX;
  282. s.y += (s.vY*s.vAmp);
  283. if (s.x >= screenX || screenX-s.x < storm.flakeWidth) { // X-axis scroll check
  284. s.x = 0;
  285. } else if (vX < 0 && s.x-storm.flakeLeftOffset<0-storm.flakeWidth) {
  286. s.x = screenX-storm.flakeWidth-1; // flakeWidth;
  287. }
  288. s.refresh();
  289. var yDiff = screenY+scrollY-s.y;
  290. if (yDiff<storm.flakeHeight) {
  291. s.active = 0;
  292. if (storm.snowStick) {
  293. s.stick();
  294. } else {
  295. s.recycle();
  296. }
  297. } else {
  298. if (storm.useMeltEffect && s.active && s.type < 3 && !s.melting && Math.random()>0.998) {
  299. // ~1/1000 chance of melting mid-air, with each frame
  300. s.melting = true;
  301. s.melt();
  302. // only incrementally melt one frame
  303. // s.melting = false;
  304. }
  305. if (storm.useTwinkleEffect) {
  306. if (!s.twinkleFrame) {
  307. if (Math.random()>0.9) {
  308. s.twinkleFrame = parseInt(Math.random()*20,10);
  309. }
  310. } else {
  311. s.twinkleFrame--;
  312. s.o.style.visibility = (s.twinkleFrame && s.twinkleFrame%2===0?'hidden':'visible');
  313. }
  314. }
  315. }
  316. };
  317.  
  318. this.animate = function() {
  319. // main animation loop
  320. // move, check status, die etc.
  321. s.move();
  322. };
  323.  
  324. this.setVelocities = function() {
  325. s.vX = vRndX+rnd(storm.vMaxX*0.12,0.1);
  326. s.vY = vRndY+rnd(storm.vMaxY*0.12,0.1);
  327. };
  328.  
  329. this.setOpacity = function(o,opacity) {
  330. if (!opacitySupported) {
  331. return false;
  332. }
  333. o.style.opacity = opacity;
  334. };
  335.  
  336. this.melt = function() {
  337. if (!storm.useMeltEffect || !s.melting) {
  338. s.recycle();
  339. } else {
  340. if (s.meltFrame < s.meltFrameCount) {
  341. s.meltFrame++;
  342. s.setOpacity(s.o,s.meltFrames[s.meltFrame]);
  343. s.o.style.fontSize = s.fontSize-(s.fontSize*(s.meltFrame/s.meltFrameCount))+'px';
  344. s.o.style.lineHeight = storm.flakeHeight+2+(storm.flakeHeight*0.75*(s.meltFrame/s.meltFrameCount))+'px';
  345. } else {
  346. s.recycle();
  347. }
  348. }
  349. };
  350.  
  351. this.recycle = function() {
  352. s.o.style.display = 'none';
  353. s.o.style.position = (fixedForEverything?'fixed':'absolute');
  354. s.o.style.bottom = 'auto';
  355. s.setVelocities();
  356. s.vCheck();
  357. s.meltFrame = 0;
  358. s.melting = false;
  359. s.setOpacity(s.o,1);
  360. s.o.style.padding = '0px';
  361. s.o.style.margin = '0px';
  362. s.o.style.fontSize = s.fontSize+'px';
  363. s.o.style.lineHeight = (storm.flakeHeight+2)+'px';
  364. s.o.style.textAlign = 'center';
  365. s.o.style.verticalAlign = 'baseline';
  366. s.x = parseInt(rnd(screenX-storm.flakeWidth-20),10);
  367. s.y = parseInt(rnd(screenY)*-1,10)-storm.flakeHeight;
  368. s.refresh();
  369. s.o.style.display = 'block';
  370. s.active = 1;
  371. };
  372.  
  373. this.recycle(); // set up x/y coords etc.
  374. this.refresh();
  375.  
  376. };
  377.  
  378. this.snow = function() {
  379. var active = 0;
  380. var used = 0;
  381. var waiting = 0;
  382. var flake = null;
  383. for (var i=s.flakes.length; i--;) {
  384. if (s.flakes[i].active == 1) {
  385. s.flakes[i].move();
  386. active++;
  387. } else if (s.flakes[i].active === 0) {
  388. used++;
  389. } else {
  390. waiting++;
  391. }
  392. if (s.flakes[i].melting) {
  393. s.flakes[i].melt();
  394. }
  395. }
  396. if (active<s.flakesMaxActive) {
  397. flake = s.flakes[parseInt(rnd(s.flakes.length),10)];
  398. if (flake.active === 0) {
  399. flake.melting = true;
  400. }
  401. }
  402. };
  403.  
  404. this.mouseMove = function(e) {
  405. if (!s.followMouse) {
  406. return true;
  407. }
  408. var x = parseInt(e.clientX,10);
  409. if (x<screenX2) {
  410. windOffset = -windMultiplier+(x/screenX2*windMultiplier);
  411. } else {
  412. x -= screenX2;
  413. windOffset = (x/screenX2)*windMultiplier;
  414. }
  415. };
  416.  
  417. this.createSnow = function(limit,allowInactive) {
  418. for (var i=0; i<limit; i++) {
  419. s.flakes[s.flakes.length] = new s.SnowFlake(s,parseInt(rnd(flakeTypes),10));
  420. if (allowInactive || i>s.flakesMaxActive) {
  421. s.flakes[s.flakes.length-1].active = -1;
  422. }
  423. }
  424. storm.targetElement.appendChild(docFrag);
  425. };
  426.  
  427. this.timerInit = function() {
  428. s.timers = (!isWin9X?[setInterval(s.snow,s.animationInterval)]:[setInterval(s.snow,s.animationInterval*3),setInterval(s.snow,s.animationInterval)]);
  429. };
  430.  
  431. this.init = function() {
  432. s.randomizeWind();
  433. s.createSnow(s.flakesMax); // create initial batch
  434. addEvent(window,'resize',s.resizeHandler);
  435. addEvent(window,'scroll',s.scrollHandler);
  436. if (!isOldIE) {
  437. addEvent(window,'blur',s.freeze);
  438. addEvent(window,'focus',s.resume);
  439. }
  440. s.resizeHandler();
  441. s.scrollHandler();
  442. if (s.followMouse) {
  443. addEvent(document,'mousemove',s.mouseMove);
  444. }
  445. s.animationInterval = Math.max(20,s.animationInterval);
  446. s.timerInit();
  447. };
  448.  
  449. var didInit = false;
  450.  
  451. this.start = function(bFromOnLoad) {
  452. if (!didInit) {
  453. didInit = true;
  454. } else if (bFromOnLoad) {
  455. // already loaded and running
  456. return true;
  457. }
  458. if (typeof s.targetElement == 'string') {
  459. var targetID = s.targetElement;
  460. s.targetElement = document.getElementById(targetID);
  461. if (!s.targetElement) {
  462. throw new Error('Snowstorm: Unable to get targetElement "'+targetID+'"');
  463. }
  464. }
  465. if (!s.targetElement) {
  466. s.targetElement = (!isIE?(document.documentElement?document.documentElement:document.body):document.body);
  467. }
  468. if (s.targetElement != document.documentElement && s.targetElement != document.body) {
  469. s.resizeHandler = s.resizeHandlerAlt; // re-map handler to get element instead of screen dimensions
  470. }
  471. s.resizeHandler(); // get bounding box elements
  472. s.usePositionFixed = (s.usePositionFixed && !noFixed); // whether or not position:fixed is supported
  473. fixedForEverything = s.usePositionFixed;
  474. if (screenX && screenY && !s.disabled) {
  475. s.init();
  476. s.active = true;
  477. }
  478. };
  479.  
  480. function doStart() {
  481. s.start(true);
  482. }
  483.  
  484. if (document.addEventListener) {
  485. // safari 3.0.4 doesn't do DOMContentLoaded, maybe others - use a fallback to be safe.
  486. document.addEventListener('DOMContentLoaded',doStart,false);
  487. window.addEventListener('load',doStart,false);
  488. } else {
  489. addEvent(window,'load',doStart);
  490. }
  491.  
  492. }
  493.  
  494. snowStorm = new SnowStorm();

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址