JavaScript - Schneefall [Gelöst]

  • bix bix
    R2-D2
    0 x
    94 Beiträge
    0 Hilfreiche Beiträge
    26. 11. 2007, 11:25

    So gehts auch im Firefox:

    1. // CREDITS:
    2. // Snowmaker
    3. // By Peter Gehrig
    4. // Copyright (c) 2003 Peter Gehrig. All rights reserved.
    5. // Permission given to use the script provided that this notice remains as is.
    6. // Additional scripts can be found at http://www.24fun.com
    7. // info@24fun.com
    8. // 11/27/2003
    9.  
    10. // IMPORTANT:
    11. // If you add this script to a script-library or script-archive
    12. // you have to add a highly visible link to
    13. // http://www.24fun.com on the webpage
    14. // where this script will be featured
    15.  
    16. ///////////////////////////////////////////////////////////////////////////
    17. // CONFIGURATION STARTS HERE
    18. ///////////////////////////////////////////////////////////////////////////
    19.  
    20. // Set the number of snowflakes (more than 30 - 40 not recommended)
    21. var snowmax = 25;
    22.  
    23. // Set the colors for the snow. Add as many colors as you like
    24. var snowcolor = new Array('#618dec', '#d0ddf9', '#b2b6e7', '#d9d9d9');
    25.  
    26. // Set the fonts, that create the snowflakes. Add as many fonts as you like
    27. var snowtype = new Array('Arial Black', 'Arial Narrow', 'Times', 'Comic Sans MS');
    28.  
    29. // Set the letter that creates your snowflake (recommended: *)
    30. var snowletter = '*';
    31.  
    32. // Set the speed of sinking (recommended values range from 0.3 to 2)
    33. var sinkspeed = 0.2;
    34.  
    35. // Set the maximal-size of your snowflaxes
    36. var snowmaxsize = 35;
    37.  
    38. // Set the minimal-size of your snowflaxes
    39. var snowminsize = 10;
    40.  
    41. // Set the snowing-zone
    42. // Set 1 for all-over-snowing
    43. // Set 2 for left-side-snowing
    44. // Set 3 for center-snowing
    45. // Set 4 for right-side-snowing
    46. var snowingzone = 1;
    47.  
    48. ///////////////////////////////////////////////////////////////////////////
    49. // CONFIGURATION ENDS HERE
    50. ///////////////////////////////////////////////////////////////////////////
    51.  
    52. // Do not edit below this line
    53. var snow = new Array();
    54. var marginbottom;
    55. var marginright;
    56. var timer;
    57. var i_snow = 0;
    58. var x_mv = new Array();
    59. var crds = new Array();
    60. var lftrght = new Array();
    61. var browserinfos = navigator.userAgent;
    62. var ie5 = document.all && document.getElementById && !browserinfos.match(/Opera/);
    63. var ns6 = document.getElementById && !document.all;
    64. var opera = browserinfos.match(/Opera/);
    65. var browserok = ie5 || ns6 || opera;
    66.  
    67. function randommaker(range)
    68. {
    69. return Math.floor(range * Math.random());
    70. }
    71.  
    72. function initsnow()
    73. {
    74. if (ie5 || opera)
    75. {
    76. marginbottom = document.body.clientHeight;
    77. marginright = document.body.clientWidth;
    78. }
    79. else if (ns6)
    80. {
    81. marginbottom = window.innerHeight;
    82. marginright = window.innerWidth;
    83. }
    84.  
    85. var snowsizerange = snowmaxsize - snowminsize;
    86.  
    87. for (var i = 0; i <= snowmax; i++)
    88. {
    89. crds[i] = 0;
    90. lftrght[i] = Math.random() * 15;
    91. x_mv[i] = 0.03 + Math.random() / 10;
    92. snow[i] = document.getElementById('s' + i);
    93. snow[i].style.fontFamily = snowtype[randommaker(snowtype.length)];
    94. snow[i].size = randommaker(snowsizerange) + snowminsize;
    95. snow[i].style.fontSize = snow[i].size + "px";
    96. snow[i].style.color = snowcolor[randommaker(snowcolor.length)];
    97. snow[i].sink = sinkspeed * snow[i].size / 5;
    98.  
    99. if (snowingzone == 1)
    100. snow[i].posx = randommaker(marginright - snow[i].size);
    101.  
    102. if (snowingzone == 2)
    103. snow[i].posx = randommaker(marginright / 2 - snow[i].size);
    104.  
    105. if (snowingzone == 3)
    106. snow[i].posx = randommaker(marginright / 2 - snow[i].size) + marginright / 4;
    107.  
    108. if (snowingzone == 4)
    109. snow[i].posx = randommaker(marginright / 2 - snow[i].size) + marginright / 2;
    110.  
    111. snow[i].posy = randommaker(2 * marginbottom - marginbottom - 2 * snow[i].size);
    112. snow[i].style.left = snow[i].posx + "px";
    113. snow[i].style.top = snow[i].posy + "px";
    114. }
    115.  
    116. movesnow();
    117. }
    118.  
    119. function movesnow()
    120. {
    121. for (var i = 0; i <= snowmax; i++)
    122. {
    123. crds[i] += x_mv[i];
    124. snow[i].posy += snow[i].sink;
    125. snow[i].style.left = snow[i].posx + lftrght[i] * Math.sin(crds[i]) + "px";
    126. snow[i].style.top = snow[i].posy + "px";
    127.  
    128. if ((snow[i].posy >= (marginbottom - 2 * snow[i].size)) || (parseInt(snow[i].style.left) > (marginright - 3 * lftrght[i])))
    129. {
    130. if (snowingzone == 1)
    131. snow[i].posx = randommaker(marginright - snow[i].size);
    132.  
    133. if (snowingzone == 2)
    134. snow[i].posx = randommaker(marginright / 2 - snow[i].size);
    135.  
    136. if (snowingzone == 3)
    137. snow[i].posx = randommaker(marginright / 2 - snow[i].size) + marginright / 4;
    138.  
    139. if (snowingzone == 4)
    140. snow[i].posx = randommaker(marginright / 2 - snow[i].size) + marginright / 2;
    141.  
    142. snow[i].posy = 0;
    143. }
    144. }
    145.  
    146. var timer = setTimeout('movesnow();', 20); //Wert von 10 bis 100
    147. }
    148.  
    149. for (var i = 0; i <= snowmax; i++)
    150. document.write('<span id="s' + i +'" style="z-index: 9999; position: absolute; top: -' + snowmaxsize + '">' + snowletter + '</span>');
    151.  
    152. if (browserok)
    153. window.onload = initsnow;

    Grüße
    bix


  • 1
  • einpraegsam.net einpraegs...
    MacGyver
    0 x
    9340 Beiträge
    80 Hilfreiche Beiträge
    26. 11. 2007, 12:29

    Oder so - einfach JS einbinden (Beispiel auf [url]http://www.wunschtacho.de[/url]):

    1. /*
    2.   DHTML PNG Snowstorm! OO-style Jascript-based Snow effect
    3.   --------------------------------------------------------
    4.   Version 1.2.20041121a
    5.   Dependencies: GIF/PNG images (0 through 4.gif/png)
    6.   Code by Scott Schiller - www.schillmania.com
    7.   --------------------------------------------------------
    8.   Description:
    9.  
    10.   Initializes after body onload() by default (via addEventHandler() call at bottom.)
    11.  
    12.   Properties:
    13.  
    14.   usePNG
    15.   ---------------
    16.   Enables PNG images if supported ("false" disables all PNG usage)
    17.  
    18.   flakeTypes
    19.   ---------------
    20.   Sets the range of flake images to use (eg. a value of 5
    21.   will use images ranging from 0.png to 4.png.)
    22.  
    23.   flakesMax
    24.   ---------------
    25.   Sets the maximum number of snowflakes that can exist on
    26.   the screen at any given time.
    27.  
    28.   flakesMaxActive
    29.   ---------------
    30.   Sets the limit of "falling" snowflakes (ie. moving, thus
    31.   considered to be "active".)
    32.  
    33.   vMax
    34.   ---------------
    35.   Defines the maximum X and Y velocities for the storm.
    36.   A range up to this value is selected at random.
    37.  
    38.   flakeWidth
    39.   ---------------
    40.   The width (in pixels) of each snowflake image.
    41.  
    42.   flakeHeight
    43.   ---------------
    44.   Height (pixels) of each snowflake image.
    45.  
    46.   flakeBottom
    47.   ---------------
    48.   Limits the "bottom" coordinate of the snow.
    49.  
    50.   snowCollect
    51.   ---------------
    52.   Enables snow to pile up (slowly) at bottom of window.
    53.   Can be very CPU/resource-intensive over time.
    54.  
    55. */
    56.  
    57. var snowStorm = null;
    58.  
    59. function SnowStorm() {
    60. var s = this;
    61. var storm = this;
    62. this.timers = [];
    63. this.flakes = [];
    64. this.disabled = false;
    65. this.terrain = [];
    66.  
    67. // User-configurable variables
    68. // ---------------------------
    69.  
    70. var usePNG = true;
    71. var imagePath = '/fileadmin/wunschtacho/img/snow/'; // relative path to snow images
    72. var flakeTypes = 6;
    73. var flakesMax = 256;
    74. var flakesMaxActive = 128;
    75. var vMax = 4.5;
    76. var flakeWidth = 8;
    77. var flakeHeight = 8;
    78. var flakeBottom = null; // Integer for fixed bottom, 0 or null for "full-screen" snow effect
    79. var snowCollect = true;
    80. var showStatus = true;
    81.  
    82. // --- End of user section ---
    83.  
    84. var isIE = (navigator.appName.toLowerCase().indexOf('internet explorer')+1);
    85. var isWin9X = (navigator.appVersion.toLowerCase().indexOf('windows 98')+1);
    86. var isOpera = (navigator.userAgent.toLowerCase().indexOf('opera ')+1 || navigator.userAgent.toLowerCase().indexOf('opera/')+1);
    87. if (isOpera) isIE = false; // Opera (which is sneaky, pretending to be IE by default)
    88. var screenX = null;
    89. var screenY = null;
    90. var scrollY = null;
    91. var vRndX = null;
    92. var vRndY = null;
    93.  
    94. function rnd(n,min) {
    95. if (isNaN(min)) min = 0;
    96. return (Math.random()*n)+min;
    97. }
    98.  
    99. this.randomizeWind = function() {
    100. vRndX = plusMinus(rnd(vMax,0.2));
    101. vRndY = rnd(vMax,0.2);
    102. if (this.flakes) {
    103. for (var i=0; i<this.flakes.length; i++) {
    104. if (this.flakes[i].active) this.flakes[i].setVelocities();
    105. }
    106. }
    107. }
    108.  
    109. function plusMinus(n) {
    110. return (parseInt(rnd(2))==1?n*-1:n);
    111. }
    112.  
    113. this.resizeHandler = function() {
    114. if (window.innerWidth || window.innerHeight) {
    115. screenX = window.innerWidth-(!isIE?24:2);
    116. screenY = (flakeBottom?flakeBottom:window.innerHeight);
    117. } else {
    118. screenX = (document.documentElement.clientWidth||document.body.clientWidth||document.body.scrollWidth)-(!isIE?8:0);
    119. screenY = flakeBottom?flakeBottom:(document.documentElement.clientHeight||document.body.clientHeight||document.body.scrollHeight);
    120. }
    121. s.scrollHandler();
    122. }
    123.  
    124. this.scrollHandler = function() {
    125. // "attach" snowflakes to bottom of window if no absolute bottom value was given
    126. scrollY = (flakeBottom?0:parseInt(window.scrollY||document.documentElement.scrollTop||document.body.scrollTop));
    127. if (isNaN(scrollY)) scrollY = 0; // Netscape 6 scroll fix
    128. if (!flakeBottom && s.flakes) {
    129. for (var i=0; i<s.flakes.length; i++) {
    130. if (s.flakes[i].active == 0) s.flakes[i].stick();
    131. }
    132. }
    133. }
    134.  
    135. this.freeze = function() {
    136. // pause animation
    137. if (!s.disabled) {
    138. s.disabled = 1;
    139. } else {
    140. return false;
    141. }
    142. if (!isWin9X) {
    143. clearInterval(s.timers);
    144. } else {
    145. for (var i=0; i<s.timers.length; i++) {
    146. clearInterval(s.timers[i]);
    147. }
    148. }
    149. }
    150.  
    151. this.resume = function() {
    152. if (s.disabled) {
    153. s.disabled = 0;
    154. } else {
    155. return false;
    156. }
    157. s.timerInit();
    158. }
    159.  
    160. this.stop = function() {
    161. this.freeze();
    162. for (var i=0; i<this.flakes.length; i++) {
    163. this.flakes[i].o.style.display = 'none';
    164. }
    165. removeEventHandler(window,'scroll',this.scrollHandler,false);
    166. removeEventHandler(window,'resize',this.resizeHandler,false);
    167. }
    168.  
    169. this.SnowFlake = function(parent,type,x,y) {
    170. var s = this;
    171. var storm = parent;
    172. this.type = type;
    173. this.x = x||parseInt(rnd(screenX-12));
    174. this.y = (!isNaN(y)?y:-12);
    175. this.vX = null;
    176. this.vY = null;
    177. this.vAmpTypes = [2.0,1.0,1.25,1.0,1.5,1.75]; // "amplification" for vX/vY (based on flake size/type)
    178. this.vAmp = this.vAmpTypes[this.type];
    179.  
    180. this.active = 1;
    181. this.o = document.createElement('img');
    182. this.o.style.position = 'absolute';
    183. this.o.style.width = flakeWidth+'px';
    184. this.o.style.height = flakeHeight+'px';
    185. this.o.style.fontSize = '1px'; // so IE keeps proper size
    186. this.o.style.zIndex = 2;
    187. this.o.src = imagePath+this.type+(pngHandler.supported && usePNG?'.png':'.gif');
    188. document.body.appendChild(this.o);
    189. if (pngHandler.supported && usePNG) pngHandler.transform(this.o);
    190.  
    191. this.refresh = function() {
    192. this.o.style.left = this.x+'px';
    193. this.o.style.top = this.y+'px';
    194. }
    195.  
    196. this.stick = function() {
    197. s.o.style.top = (screenY+scrollY-flakeHeight-storm.terrain[Math.floor(this.x)])+'px';
    198. // called after relative left has been called
    199. }
    200.  
    201. this.vCheck = function() {
    202. if (this.vX>=0 && this.vX<0.2) {
    203. this.vX = 0.2;
    204. } else if (this.vX<0 && this.vX>-0.2) {
    205. this.vX = -0.2;
    206. }
    207. if (this.vY>=0 && this.vY<0.2) {
    208. this.vY = 0.2;
    209. }
    210. }
    211.  
    212. this.move = function() {
    213. this.x += this.vX;
    214. this.y += (this.vY*this.vAmp);
    215. this.refresh();
    216.  
    217. if (this.vX && screenX-this.x<flakeWidth+this.vX) { // X-axis scroll check
    218. this.x = 0;
    219. } else if (this.vX<0 && this.x<0-flakeWidth) {
    220. this.x = screenX-flakeWidth; // flakeWidth;
    221. }
    222. var yDiff = screenY+scrollY-this.y-storm.terrain[Math.floor(this.x)];
    223. if (yDiff<flakeHeight) {
    224. this.active = 0;
    225. if (snowCollect) {
    226. var height = [0.75,1.5,0.75];
    227. for (var i=0; i<2; i++) {
    228. storm.terrain[Math.floor(this.x)+i+2] += height[i];
    229. }
    230. }
    231. this.o.style.left = ((this.x-(!isIE?flakeWidth:0))/screenX*100)+'%'; // set "relative" left (change with resize)
    232. if (!flakeBottom) {
    233. this.stick();
    234. }
    235. }
    236. }
    237.  
    238. this.animate = function() {
    239. // main animation loop
    240. // move, check status, die etc.
    241. this.move();
    242. }
    243.  
    244. this.setVelocities = function() {
    245. this.vX = vRndX+rnd(vMax*0.12,0.1);
    246. this.vY = vRndY+rnd(vMax*0.12,0.1);
    247. }
    248.  
    249. this.recycle = function() {
    250. this.setVelocities();
    251. this.vCheck();
    252. this.x = parseInt(rnd(screenX-flakeWidth-1));
    253. this.y = parseInt(rnd(640)*-1)-flakeHeight;
    254. this.active = 1;
    255. }
    256.  
    257. this.recycle(); // set up x/y coords etc.
    258. this.refresh();
    259.  
    260. }
    261.  
    262. this.snow = function() {
    263. var active = 0;
    264. var used = 0;
    265. var waiting = 0;
    266. for (var i=this.flakes.length-1; i>0; i--) {
    267. if (this.flakes[i].active == 1) {
    268. this.flakes[i].animate();
    269. active++;
    270. } else if (this.flakes[i].active == 0) {
    271. used++;
    272. } else {
    273. waiting++;
    274. }
    275. }
    276. if (snowCollect && !waiting) { // !active && !waiting
    277. // create another batch of snow
    278. this.createSnow(flakesMaxActive,true);
    279. }
    280. if (active<flakesMaxActive) {
    281. with (this.flakes[parseInt(rnd(this.flakes.length))]) {
    282. if (!snowCollect && active == 0) {
    283. recycle();
    284. } else if (active == -1) {
    285. active = 1;
    286. }
    287. }
    288. }
    289. }
    290.  
    291. this.createSnow = function(limit,allowInactive) {
    292. if (showStatus) window.status = 'Creating snow...';
    293. for (var i=0; i<limit; i++) {
    294. this.flakes[this.flakes.length] = new this.SnowFlake(this,parseInt(rnd(flakeTypes)));
    295. if (allowInactive || i>flakesMaxActive) this.flakes[this.flakes.length-1].active = -1;
    296. }
    297. if (showStatus) window.status = '';
    298. }
    299.  
    300. this.timerInit = function() {
    301. this.timers = (!isWin9X?setInterval("snowStorm.snow()",20):[setInterval("snowStorm.snow()",75),setInterval("snowStorm.snow()",25)]);
    302. }
    303.  
    304. this.init = function() {
    305. for (var i=0; i<8192; i++) {
    306. this.terrain[i] = 0;
    307. }
    308. this.randomizeWind();
    309. this.createSnow(snowCollect?flakesMaxActive:flakesMaxActive*2); // create initial batch
    310. addEventHandler(window,'resize',this.resizeHandler,false);
    311. addEventHandler(window,'scroll',this.scrollHandler,false);
    312. // addEventHandler(window,'scroll',this.resume,false); // scroll does not cause window focus. (odd)
    313. // addEventHandler(window,'blur',this.freeze,false);
    314. // addEventHandler(window,'focus',this.resume,false);
    315. this.timerInit();
    316. }
    317.  
    318. this.resizeHandler(); // get screen coordinates
    319.  
    320. if (screenX && screenY && !this.disabled) {
    321. this.init();
    322. }
    323.  
    324. }
    325.  
    326. function snowStormInit() {
    327. setTimeout("snowStorm = new SnowStorm()",500);
    328. }
    329.  
    330. // Generic addEventHandler() wrapper
    331. // ---------------------------------
    332. // A generic interface for adding DOM event handlers
    333. // Version 1.2.20040404
    334. //
    335. // Code by Scott Schiller | schillmania.com
    336. //
    337. // Revision history:
    338. // ---------------------------------
    339. // v1.1.20031218: initial deploy
    340. // v1.2.20040404: added post-load event check
    341.  
    342. var addEventHandler = null;
    343. var removeEventHandler = null;
    344.  
    345. function postLoadEvent(eventType) {
    346. // test for adding an event to the body (which has already loaded) - if so, fire immediately
    347. return ((eventType.toLowerCase().indexOf('load')>=0) && document.body);
    348. }
    349.  
    350. function addEventHandlerDOM(o,eventType,eventHandler,eventBubble) {
    351. if (!postLoadEvent(eventType)) {
    352. o.addEventListener(eventType,eventHandler,eventBubble);
    353. } else {
    354. eventHandler();
    355. }
    356. }
    357.  
    358. function removeEventHandlerDOM(o,eventType,eventHandler,eventBubble) {
    359. o.removeEventListener(eventType,eventHandler,eventBubble);
    360. }
    361.  
    362. function addEventHandlerIE(o,eventType,eventHandler) { // IE workaround
    363. if (!eventType.indexOf('on')+1) eventType = 'on'+eventType;
    364. if (!postLoadEvent(eventType)) {
    365. o.attachEvent(eventType,eventHandler); // Note addition of "on" to event type
    366. } else {
    367. eventHandler();
    368. }
    369. }
    370.  
    371. function removeEventHandlerIE(o,eventType,eventHandler) {
    372. if (!eventType.indexOf('on')+1) eventType = 'on'+eventType;
    373. o.detachEvent(eventType,eventHandler);
    374. }
    375.  
    376. function addEventHandlerOpera(o,eventType,eventHandler,eventBubble) {
    377. if (!postLoadEvent(eventType)) {
    378. (o==window?document:o).addEventListener(eventType,eventHandler,eventBubble);
    379. } else {
    380. eventHandler();
    381. }
    382. }
    383.  
    384. function removeEventHandlerOpera(o,eventType,eventHandler,eventBubble) {
    385. (o==window?document:o).removeEventListener(eventType,eventHandler,eventBubble);
    386. }
    387.  
    388. if (navigator.userAgent.toLowerCase().indexOf('opera ')+1 || navigator.userAgent.toLowerCase().indexOf('opera/')+1) {
    389. // opera is dumb at times.
    390. addEventHandler = addEventHandlerOpera;
    391. removeEventHandler = removeEventHandlerOpera;
    392. } else if (document.addEventListener) { // DOM event handler method
    393. addEventHandler = addEventHandlerDOM;
    394. removeEventHandler = removeEventHandlerDOM;
    395. } else if (document.attachEvent) { // IE event handler method
    396. addEventHandler = addEventHandlerIE;
    397. removeEventHandler = removeEventHandlerIE;
    398. } else { // Neither "DOM level 2" (?) methods supported
    399. addEventHandler = function(o,eventType,eventHandler,eventBubble) {
    400. o['on'+eventType] = eventHandler;
    401. // Multiple events could be added here via array etc.
    402. }
    403. removeEventHandler = function(o,eventType,eventHandler,eventBubble) {}
    404. }
    405.  
    406. // Safari 1.0 does not support window.scroll events - apparently netscape 6.0/6.2 and mozilla 1.4 also.
    407. // Refer to events support table at http://www.quirksmode.org/js/events_compinfo.html
    408.  
    409. // -- end addEventHandler definition --
    410.  
    411. /*
    412.   PNGHandler: Object-Oriented Javascript-based PNG wrapper
    413.   --------------------------------------------------------
    414.   Version 1.2.20040803
    415.   Code by Scott Schiller - www.schillmania.com
    416.   --------------------------------------------------------
    417.   Description:
    418.   Provides gracefully-degrading PNG functionality where
    419.   PNG is supported natively or via filters (Damn you, IE!)
    420.   Should work with PNGs as images and DIV background images.
    421.   --------------------------------------------------------
    422.   Revision history
    423.   --------------------------------------------------------
    424.   1.2
    425.   - Added refresh() for changing PNG images under IE
    426.   - Class extension: "scale" causes PNG to scale under IE
    427.   --------------------------------------------------------
    428.   Known bugs
    429.   --------------------------------------------------------
    430.   - ie:mac doesn't support PNG background images.
    431.   - Safari doesn't support currentStyle() - can't parse BG
    432.   via CSS (ie. for a DIV with a PNG background by class)
    433.  
    434. */
    435.  
    436. function PNGHandler() {
    437. var self = this;
    438.  
    439. this.na = navigator.appName.toLowerCase();
    440. this.nv = navigator.appVersion.toLowerCase();
    441. this.isIE = this.na.indexOf('internet explorer')+1?1:0;
    442. this.isWin = this.nv.indexOf('windows')+1?1:0;
    443. this.isIEMac = (this.isIE&&!this.isWin);
    444. this.isIEWin = (this.isIE&&this.isWin);
    445. this.ver = this.isIE?parseFloat(this.nv.split('msie ')[1]):parseFloat(this.nv);
    446. this.isMac = this.nv.indexOf('mac')+1?1:0;
    447. this.isOpera = (navigator.userAgent.toLowerCase().indexOf('opera ')+1 || navigator.userAgent.toLowerCase().indexOf('opera/')+1);
    448. if (this.isOpera) this.isIE = false; // Opera filter catch (which is sneaky, pretending to be IE by default)
    449. this.filterID = 'DXImageTransform.Microsoft.AlphaImageLoader';
    450. this.supported = false;
    451. this.transform = self.doNothing;
    452.  
    453. this.filterMethod = function(o) {
    454. // IE 5.5+ proprietary filter garbage (boo!)
    455. // Create new element based on old one. Doesn't seem to render properly otherwise (due to filter?)
    456. // use DOM "currentStyle" method, so rules inherited via CSS are picked up.
    457. if (o.nodeName != 'IMG') {
    458. var b = o.currentStyle.backgroundImage.toString(); // parse out background image URL
    459. o.style.backgroundImage = 'none';
    460. // Parse out background image URL from currentStyle.
    461. var i1 = b.indexOf('url("')+5;
    462. var newSrc = b.substr(i1,b.length-i1-2).replace('.gif','.png'); // find first instance of ") after (", chop from string
    463. o.style.writingMode = 'lr-tb'; // Has to be applied so filter "has layout" and is displayed. Seriously. Refer to http://msdn.microsoft.com/workshop/author/filter/reference/filters/alphaimageloader.asp?frame=true
    464. o.style.filter = "progid:"+self.filterID+"(src='"+newSrc+"',sizingMethod='"+(o.className.indexOf('scale')+1?'scale':'crop')+"')";
    465. } else if (o.nodeName == 'IMG') {
    466. var newSrc = o.getAttribute('src').replace('.gif','.png');
    467. // apply filter
    468. o.src = 'image/none.gif'; // get rid of image
    469. o.style.filter = "progid:"+self.filterID+"(src='"+newSrc+"',sizingMethod="+(o.className.indexOf('scale')+1?'scale':'crop')+"')";
    470. o.style.writingMode = 'lr-tb'; // Has to be applied so filter "has layout" and is displayed. Seriously. Refer to http://msdn.microsoft.com/workshop/author/filter/reference/filters/alphaimageloader.asp?frame=true
    471. }
    472. }
    473.  
    474. this.pngMethod = function(o) {
    475. // Native transparency support. Easy to implement. (woo!)
    476. bgImage = this.getBackgroundImage(o);
    477. if (bgImage) {
    478. // set background image, replacing .gif
    479. o.style.backgroundImage = 'url('+bgImage.replace('.gif','.png')+')';
    480. } else if (o.nodeName == 'IMG') {
    481. o.src = o.src.replace('.gif','.png');
    482. } else if (!bgImage) {
    483. // no background image
    484. }
    485. }
    486.  
    487. this.getBackgroundImage = function(o) {
    488. var b, i1; // background-related variables
    489. var bgUrl = null;
    490. if (o.nodeName != 'IMG' && !(this.isIE && this.isMac)) { // ie:mac PNG support broken for DIVs with PNG backgrounds
    491. if (document.defaultView) {
    492. if (document.defaultView.getComputedStyle) {
    493. b = document.defaultView.getComputedStyle(o,'').getPropertyValue('background-image');
    494. i1 = b.indexOf('url(')+4;
    495. bgUrl = b.substr(i1,b.length-i1-1);
    496. } else {
    497. // no computed style
    498. return false;
    499. }
    500. } else {
    501. // no default view
    502. return false;
    503. }
    504. }
    505. return bgUrl;
    506. }
    507.  
    508. this.doNothing = function() {}
    509.  
    510. this.supportTest = function() {
    511. // Determine method to use.
    512. // IE 5.5+/win32: filter
    513.  
    514. if (this.isIE && this.isWin && this.ver >= 5.5) {
    515. // IE proprietary filter method (via DXFilter)
    516. self.transform = self.filterMethod;
    517. } else if (!this.isIE && this.ver < 5) {
    518. // No PNG support or broken support
    519. // Leave existing content as-is
    520. self.transform = null;
    521. return false;
    522. } else if (!this.isIE && this.ver >= 5 || (this.isIE && this.isMac && this.ver >= 5)) { // version 5+ browser (not IE), or IE:mac 5+
    523. self.transform = self.pngMethod;
    524. } else {
    525. // Presumably no PNG support. GIF used instead.
    526. self.transform = null;
    527. return false;
    528. }
    529. return true;
    530. }
    531.  
    532. this.init = function() {
    533. this.supported = this.supportTest();
    534. }
    535.  
    536. }
    537.  
    538. function getElementsByClassName(className,oParent) {
    539. var doc = (oParent||document);
    540. var matches = [];
    541. var nodes = doc.all||doc.getElementsByTagName('*');
    542. for (var i=0; i<nodes.length; i++) {
    543. if (nodes[i].className == className || nodes[i].className.indexOf(className)+1 || nodes[i].className.indexOf(className+' ')+1 || nodes[i].className.indexOf(' '+className)+1) {
    544. matches[matches.length] = nodes[i];
    545. }
    546. }
    547. return matches; // kids, don't play with fire. ;)
    548. }
    549.  
    550. // Instantiate and initialize PNG Handler
    551.  
    552. var pngHandler = new PNGHandler();
    553.  
    554. pngHandler.init();
    555.  
    556.  
    557. addEventHandler(window,'load',snowStormInit,false);

    in2code.de - Wir leben TYPO3
    - Möchtest du TYPO3 komplett verstehen? Eigene Erweiterungen erstellen? Bei uns gibt es auch Schulungen https://www.in2code.de/produkte/typo3-schulungen/
    - Die Arbeit mit TYPO3 macht dir Spaß? Du stehst auf Berge? Komm zu uns! https://www.in2code.de/agentur/karriere/

  • bix bix
    R2-D2
    0 x
    94 Beiträge
    0 Hilfreiche Beiträge
    27. 11. 2007, 08:37

    Ahh... das ist auch schön. Vor allem wie die Flocken unten liegen bleiben. Jetzt müssten sie sich nur noch stapeln ;)

  • 1