Trang trí khung cảnh Halloween cho website

Hình demo website có khung cảnh Halloween

Cách làm rất đơn giản, bạn chỉ cần copy đoạn mã sau và bỏ vào trước thẻ đóng</html>

Style 1: Chỉ con dơi "Quỷ" bay:

<script src="http://iwebs.vn/js/halloween/js.halloween.js"></script>

Style 2: Đầy đủ khung cảnh, cả con dơi "Quỷ" bay:

<script src="http://iwebs.vn/js/halloween/js.halloween2.js"></script>

Style 3: Đầy đủ khung cảnh, cả con dơi "Quỷ" bay:

<script LANGUAGE="JavaScript"  src="http://iwebs.vn/js/halloween/js.halloween3.js"></script>

Style 4: Đầy đủ khung cảnh, cả con dơi "Quỷ" bay:

<script LANGUAGE="JavaScript"  src="http://iwebs.vn/js/halloween/js.halloween4.js"></script>

Nếu không được, thì copy từng đoạn sau và dán vào trước thẻ đóng </html>

<script> </script>

<SCRIPT LANGUAGE="JavaScript"> /** * You may use this code for free on any web page provided that * these comment lines and the following credit remain in the code. * Compact Cross Browser Ghosts effect by ITExpress.vn */ if(!window.JSFX) JSFX=new Object(); JSFX.ghostImages = new Array( "<img src='http://iwebs.vn/js/halloween/ghostdreams2002.gif'>", "<img src='http://iwebs.vn/js/halloween/ghostdreams2003.gif'>", "<img src='http://iwebs.vn/js/halloween/ghostdreams2004.gif'>", "<img src='http://iwebs.vn/js/halloween/ghostdreams2006.gif'>" ); var ns4 = document.layers; var ie4 = document.all; JSFX.makeLayer = function(id) { var el = document.getElementById ? document.getElementById(id) : document.all ? document.all[id] : document.layers[id]; if(ns4) el.style=el; el.sP=function(x,y){this.style.left = x;this.style.top=y;}; el.show=function(){ this.style.visibility = "visible"; } el.hide=function(){ this.style.visibility = "hidden"; } if(ns4 || window.opera) el.sO = function(pc){return 0;}; else if(ie4) el.sO = function(pc) { if(this.style.filter=="") this.style.filter="alpha(opacity=100);"; this.filters.alpha.opacity=pc; } else el.sO = function(pc){this.style.MozOpacity=pc/100;} return el; } if(window.innerWidth) { gX=function(){return innerWidth;}; gY=function(){return innerHeight;}; } else { gX=function(){return document.body.clientWidth-30;}; gY=function(){return document.body.clientHeight-30;}; } JSFX.ghostOutput=function() { for(var i=0 ; i<JSFX.ghostImages.length ; i++) document.write(ns4 ? "<LAYER NAME='gh"+i+"'>"+JSFX.ghostImages[i]+"</LAYER>" : "<DIV id='gh"+i+"' style='position:absolute'>"+JSFX.ghostImages[i]+"</DIV>" ); } JSFX.ghostSprites = new Array(); JSFX.ghostStartAni = function() { for(var i=0 ;i<JSFX.ghostImages.length;i++) { var el=JSFX.makeLayer("gh"+i); el.x=Math.random()*gX(); el.y=Math.random()*gY(); el.tx=Math.random()*gX(); el.ty=Math.random()*gY(); el.dx=-5+Math.random()*10; el.dy=-5+Math.random()*10; el.state="off"; el.op=0; el.sO(el.op); el.hide(); JSFX.ghostSprites[i] = el; } setInterval("JSFX.ghostAni()", 40); } JSFX.ghostAni = function() { for(var i=0 ;i<JSFX.ghostSprites.length;i++) { el=JSFX.ghostSprites[i]; if(el.state == "off") { if(Math.random() > .99) { el.state="up"; el.show(); } } else if(el.state == "on") { if(Math.random() > .98) el.state="down"; } else if(el.state == "up") { el.op += 2; el.sO(el.op); if(el.op==100) el.state = "on"; } else if(el.state == "down") { el.op -= 2; if(el.op==0) { el.hide(); el.state = "off"; } else el.sO(el.op); } var X = (el.tx - el.x); var Y = (el.ty - el.y); var len = Math.sqrt(X*X+Y*Y); if(len < 1) len = 1; var dx = 20 * (X/len); var dy = 20 * (Y/len); var ddx = (dx - el.dx)/10; var ddy = (dy - el.dy)/10; el.dx += ddx; el.dy += ddy; el.sP(el.x+=el.dx,el.y+=el.dy); if(Math.random() >.95 ) { el.tx = Math.random()*gX(); el.ty = Math.random()*gY(); } } } JSFX.ghostStart = function() { if(JSFX.ghostLoad)JSFX.ghostLoad(); JSFX.ghostStartAni(); } JSFX.ghostOutput(); JSFX.ghostLoad=window.onload; window.onload=JSFX.ghostStart; </SCRIPT>

<SCRIPT LANGUAGE="JavaScript"> /** * You may use this code for free on any web page provided that * these comment lines and the following credit remain in the code. * Compact Cross Browser Ghosts effect by ITExpress.vn */ if(!window.JSFX) JSFX=new Object(); JSFX.ghostImages = new Array( "<img src='http://iwebs.vn/js/halloween/brooms2.gif'>", "<img src='http://iwebs.vn/js/halloween/battss.gif'>", "<img src='http://iwebs.vn/js/halloween/battss.gif'>", "<img src='http://iwebs.vn/js/halloween/battss.gif'>", "<img src='http://iwebs.vn/js/halloween/battss.gif'>", "<img src='http://iwebs.vn/js/halloween/battss.gif'>", "<img src='http://iwebs.vn/js/halloween/battss.gif'>" ); var ns4 = document.layers; var ie4 = document.all; JSFX.makeLayer = function(id) { var el = document.getElementById ? document.getElementById(id) : document.all ? document.all[id] : document.layers[id]; if(ns4) el.style=el; el.sP=function(x,y){this.style.left = x;this.style.top=y;}; el.show=function(){ this.style.visibility = "visible"; } el.hide=function(){ this.style.visibility = "hidden"; } if(ns4 || window.opera) el.sO = function(pc){return 0;}; else if(ie4) el.sO = function(pc) { if(this.style.filter=="") this.style.filter="alpha(opacity=100);"; this.filters.alpha.opacity=pc; } else el.sO = function(pc){this.style.MozOpacity=pc/100;} return el; } if(window.innerWidth) { gX=function(){return innerWidth;}; gY=function(){return innerHeight;}; } else { gX=function(){return document.body.clientWidth-30;}; gY=function(){return document.body.clientHeight-30;}; } JSFX.ghostOutput=function() { for(var i=0 ; i<JSFX.ghostImages.length ; i++) document.write(ns4 ? "<LAYER NAME='gh"+i+"'>"+JSFX.ghostImages[i]+"</LAYER>" : "<DIV id='gh"+i+"' style='position:absolute'>"+JSFX.ghostImages[i]+"</DIV>" ); } JSFX.ghostSprites = new Array(); JSFX.ghostStartAni = function() { for(var i=0 ;i<JSFX.ghostImages.length;i++) { var el=JSFX.makeLayer("gh"+i); el.x=Math.random()*gX(); el.y=Math.random()*gY(); el.tx=Math.random()*gX(); el.ty=Math.random()*gY(); el.dx=-5+Math.random()*10; el.dy=-5+Math.random()*10; el.state="off"; el.op=0; el.sO(el.op); el.hide(); JSFX.ghostSprites[i] = el; } setInterval("JSFX.ghostAni()", 40); } JSFX.ghostAni = function() { for(var i=0 ;i<JSFX.ghostSprites.length;i++) { el=JSFX.ghostSprites[i]; if(el.state == "off") { if(Math.random() > .99) { el.state="up"; el.show(); } } else if(el.state == "on") { if(Math.random() > .98) el.state="down"; } else if(el.state == "up") { el.op += 2; el.sO(el.op); if(el.op==100) el.state = "on"; } else if(el.state == "down") { el.op -= 2; if(el.op==0) { el.hide(); el.state = "off"; } else el.sO(el.op); } var X = (el.tx - el.x); var Y = (el.ty - el.y); var len = Math.sqrt(X*X+Y*Y); if(len < 1) len = 1; var dx = 20 * (X/len); var dy = 20 * (Y/len); var ddx = (dx - el.dx)/10; var ddy = (dy - el.dy)/10; el.dx += ddx; el.dy += ddy; el.sP(el.x+=el.dx,el.y+=el.dy); if(Math.random() >.95 ) { el.tx = Math.random()*gX(); el.ty = Math.random()*gY(); } } } JSFX.ghostStart = function() { if(JSFX.ghostLoad)JSFX.ghostLoad(); JSFX.ghostStartAni(); } JSFX.ghostOutput(); JSFX.ghostLoad=window.onload; window.onload=JSFX.ghostStart; </SCRIPT>