Thủ Thuật
Bạn có muốn phản ứng với tin nhắn này? Vui lòng đăng ký diễn đàn trong một vài cú nhấp chuột hoặc đăng nhập để tiếp tục.


Thủ Thuật Tin Học-Thủ Thuật Hay-Thủ Thuật 5 Sao
 
Trang ChínhTrang Chính  Latest imagesLatest images  Tìm kiếmTìm kiếm  Đăng kýĐăng ký  Đăng NhậpĐăng Nhập  
Tìm kiếm
 
 

Display results as :
 
Rechercher Advanced Search
Latest topics
» Game Ai là triệu phú 1.5 + phiên bản Millionaire của NKD
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeMon Dec 27, 2010 8:17 pm by Admin

» Google Chrome 10.0.603.3 Dev/ 9.0.597.10 Dev/ 8.0.552.224 Final
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeMon Dec 27, 2010 8:14 pm by Admin

» Internet Download Manager ( IDM ) 6.04 Full Crack + Keygen + Hướng dẫn [ Mediafire ]
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeMon Dec 27, 2010 8:11 pm by Admin

» Hiệu ứng link cho blog
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeWed Dec 08, 2010 6:18 pm by Admin

» Thay nút lưu, hủy cho blog
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeWed Dec 08, 2010 6:13 pm by Admin

» K-Lite Codec Pack Update 6.6.1 Full Update - xem tất cả các định dạng video
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeWed Dec 08, 2010 8:58 am by Admin

» WinRAR (32-bit) 3.90
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeTue Dec 07, 2010 9:12 am by Admin

» Javascript - Một số hiệu ứng tuyết rơi cho web
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeTue Dec 07, 2010 9:02 am by Admin

» Windows Boot Timer | Kiểm tra khoảng thời gian khởi động của windows
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeTue Dec 07, 2010 8:55 am by Admin

» Soluto | Tăng tốc khởi động Windows
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeTue Dec 07, 2010 8:55 am by Admin

» Microsoft .NET Framework | Nền tảng của các ứng dụng .NET
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeTue Dec 07, 2010 8:54 am by Admin

» Fresh RAM 5.0.0 | Xử lí mạnh mẽ phân mảnh RAM
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeTue Dec 07, 2010 8:53 am by Admin

» Những phần mềm miễn phí hay
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeTue Dec 07, 2010 8:53 am by Admin

» Hiren's BootCD 10.6 | Hiren BootCD
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeTue Dec 07, 2010 8:53 am by Admin

» Hiren's BootCD 10.6 | Hiren BootCD
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeTue Dec 07, 2010 8:52 am by Admin

» Microsoft .NET Framework 4.0
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeTue Dec 07, 2010 8:52 am by Admin

» iCARE Data Recovery Software | Khôi phục dữ liệu bị mất
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeTue Dec 07, 2010 8:51 am by Admin

» Tạo bản sao ổ đĩa với Drive Mirroring trên Windows 7
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeSat Dec 04, 2010 7:40 am by Admin

» Mẹo nhỏ thay đổi màu nền thanh Taskbar cho windows 7
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeSat Dec 04, 2010 7:39 am by Admin

» Cách tắt screensaver mặc định trong Windows 7
Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeSat Dec 04, 2010 7:39 am by Admin

Navigation
 Portal
 Diễn Đàn
 Thành viên
 Lý lịch
 Trợ giúp
 Tìm kiếm
Liên Hệ Admin
Liên Hệ IT Minh Hà
Nghe Nhạc Trưc Tuyến
http://haivip.tk
Thế Giới Tuổi Teen-Thế Hệ Mới-Thế Hệ Tương Lai-Vì 1 Việt Nam Tươi Sáng
teen9x.forums-free.info

 

 Javascript - Một số hiệu ứng tuyết rơi cho web

Go down 
Tác giảThông điệp
Admin
Admin
Admin


Tổng số bài gửi : 186
Join date : 30/11/2010
Age : 28
Đến từ : Cà Mau Việt Nam

Javascript - Một số hiệu ứng tuyết rơi cho web Empty
Bài gửiTiêu đề: Javascript - Một số hiệu ứng tuyết rơi cho web   Javascript - Một số hiệu ứng tuyết rơi cho web Icon_minitimeTue Dec 07, 2010 9:02 am

1 - Hiệu ứng 1
- Hiệu ứng tuyết rơi sử dụng dấu * để làm tuyết, có thể thay đổi kích cỡ, màu sắc ở phần config
Coppy đoạn code bên dưới và chèn vào dưới thẻ trong trang web của bạn
Code:
<script>
 // CREDITS: // Snowmaker Copyright (c) 2003 Peter Gehrig. All rights reserved.
 // Distributed by http://www.hypergurl.com // Permission given to use the script
 on webpages provided that this notice remains as is. // Set the number of snowflakes
 (more than 30 - 40 not recommended) var snowmax=35 // Set the colors for the snow.
 Add as many colors as you like var snowcolor=new Array("#aaaacc","#ddddFF","#ccccDD")
 // Set the fonts, that create the snowflakes. Add as many fonts as you like var
 snowtype=new Array("Arial Black","Arial Narrow","Times","Comic
 Sans MS") // Set the letter that creates your snowflake (recommended:*) var
 snowletter="*" // Set the speed of sinking (recommended values range
 from 0.3 to 2) var sinkspeed=0.6 // Set the maximal-size of your snowflaxes var
 snowmaxsize=22 // Set the minimal-size of your snowflaxes var snowminsize=8 //
 Set the snowing-zone // Set 1 for all-over-snowing, set 2 for left-side-snowing
 // Set 3 for center-snowing, set 4 for right-side-snowing var  snowingzone=3  /////////////////////////////////////////////////////////////////////////// 
 // CONFIGURATION ENDS HERE ///////////////////////////////////////////////////////////////////////////
 // Do not edit below this line var snow=new Array() var marginbottom var marginright
 var timer var i_snow=0 var x_mv=new Array(); var crds=new Array(); var lftrght=new
 Array(); var browserinfos=navigator.userAgent var  ie5=document.all&&document.getElementById&&!browserinfos.match(/Opera/) 
 var ns6=document.getElementById&&!document.all var opera=browserinfos.match(/Opera/)
 var browserok=ie5||ns6||opera function randommaker(range) { rand=Math.floor(range*Math.random())
 return rand } function initsnow() { if (ie5 || opera) { marginbottom = document.body.clientHeight
 marginright = document.body.clientWidth } else if (ns6) { marginbottom = window.innerHeight
 marginright = window.innerWidth } var snowsizerange=snowmaxsize-snowminsize for
 (i=0;i<=snowmax;i++) { crds[i] = 0; lftrght[i] = Math.random()*15; x_mv[i]
 = 0.03 + Math.random()/10; snow[i]=document.getElementById("s"+i)  snow[i].style.fontFamily=snowtype[randommaker(snowtype.length)]
 snow[i].size=randommaker(snowsizerange)+snowminsize snow[i].style.fontSize=snow[i].size
 snow[i].style.color=snowcolor[randommaker(snowcolor.length)] snow[i].sink=sinkspeed*snow[i].size/5
 if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)} if (snowingzone==2)
 {snow[i].posx=randommaker(marginright/2-snow[i].size)} if  (snowingzone==3)  {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4}
 if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2}
 snow[i].posy=randommaker(2*marginbottom-marginbottom-2*snow[i].size) snow[i].style.left=snow[i].posx
 snow[i].style.top=snow[i].posy } movesnow() } function movesnow() { for (i=0;i<=snowmax;i++)
 { crds[i] += x_mv[i]; snow[i].posy+=snow[i].sink snow[i].style.left=snow[i].posx+lftrght[i]*Math.sin(crds[i]);
 snow[i].style.top=snow[i].posy if (snow[i].posy>=marginbottom-2*snow[i].size
 || parseInt(snow[i].style.left)>(marginright-3*lftrght[i])){ if (snowingzone==1)
 {snow[i].posx=randommaker(marginright-snow[i].size)} if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)}
 if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4}
 if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2}
 snow[i].posy=0 } } var timer=setTimeout("movesnow()",50) } for (i=0;i<=snowmax;i++)
 { document.write("<span id='s"+i+"' style='position:absolute;top:-"+snowmaxsize+"'>"+snowletter+"</span>")
 } if (browserok) { window.onload=initsnow } </script>

2 - Hiệu ứng 2
- Hiệu ứng tuyết rơi sử dụng ảnh
- Tải hình ảnh tuyết rơi ở đây ( có nhiều kiểu để chọn )
http://www.mediafire.com/?g79le58ol8o5rer
Code:
<script>
 var SNOW_Picture = "/billeder/snow.gif";
var SNOW_no = 15;

var SNOW_browser_IE_NS = (document.body.clientHeight) ? 1 : 0;
var SNOW_browser_MOZ = (self.innerWidth) ? 1 : 0;
var SNOW_browser_IE7 = (document.documentElement.clientHeight) ? 1 : 0;

var SNOW_Time;
var SNOW_dx, SNOW_xp, SNOW_yp;
var SNOW_am, SNOW_stx, SNOW_sty;
var i, SNOW_Browser_Width, SNOW_Browser_Height;

if (SNOW_browser_IE_NS)
{
 SNOW_Browser_Width = document.body.clientWidth;
 SNOW_Browser_Height = document.body.clientHeight;
}
else if (SNOW_browser_MOZ)
{
 SNOW_Browser_Width = self.innerWidth - 20;
 SNOW_Browser_Height = self.innerHeight;
}
else if (SNOW_browser_IE7)
{
 SNOW_Browser_Width = document.documentElement.clientWidth;
 SNOW_Browser_Height = document.documentElement.clientHeight;
}


SNOW_dx = new Array();
SNOW_xp = new Array();
SNOW_yp = new Array();
SNOW_am = new Array();
SNOW_stx = new Array();
SNOW_sty = new Array();

for (i = 0; i < SNOW_no; ++ i)
{
 SNOW_dx[i] = 0;
 SNOW_xp[i] = Math.random()*(SNOW_Browser_Width-50);
 SNOW_yp[i] = Math.random()*SNOW_Browser_Height;
 SNOW_am[i] = Math.random()*20;
 SNOW_stx[i] = 0.02 + Math.random()/10;
 SNOW_sty[i] = 0.7 + Math.random();
 if (i == 0) document.write("<\div id="SNOW_flake"+ i +"" style="position: absolute; z-index: "+ i +"; visibility: visible; top: 15px; left: 15px;"><a href="http://www.peters1.dk" target="_blank"><\img src=""+SNOW_Picture+"" border="0"></a><\/div>");
 else document.write("<\div id="SNOW_flake"+ i +"" style="position: absolute; z-index: "+ i +"; visibility: visible; top: 15px; left: 15px;"><\img src=""+SNOW_Picture+"" border="0"><\/div>");
}

function SNOW_Weather()
{

for (i = 0; i < SNOW_no; ++ i)
{
 SNOW_yp[i] += SNOW_sty[i];

 if (SNOW_yp[i] > SNOW_Browser_Height-50)
 {
 SNOW_xp[i] = Math.random()*(SNOW_Browser_Width-SNOW_am[i]-30);
 SNOW_yp[i] = 0;
 SNOW_stx[i] = 0.02 + Math.random()/10;
 SNOW_sty[i] = 0.7 + Math.random();
 }

 SNOW_dx[i] += SNOW_stx[i];

 document.getElementById("SNOW_flake"+i).style.top=SNOW_yp[i]+"px";
 document.getElementById("SNOW_flake"+i).style.left=SNOW_xp[i] + SNOW_am[i]*Math.sin(SNOW_dx[i])+"px";
}

SNOW_Time = setTimeout("SNOW_Weather()", 10);

}

SNOW_Weather();
 </script>

3 - Hiệu ứng 3
- Hiệu ứng tuyết bay theo chiều gió (bay theo con trỏ chuột)

Code:
<script type="text/javascript" name="snow.js">
if  ((document.getElementById) &&
window.addEventListener || window.attachEvent){

(function(){

//Configure here.

var num = 60;  //Number of flakes
var timer = 30; //setTimeout speed. Varies on different comps

//End.

var y = [];
var x = [];
var fall = [];
var theFlakes = [];
var sfs = [];
var step = [];
var currStep = [];
var h,w,r;
var d = document;
var pix = "px";
var domWw = (typeof window.innerWidth == "number");
var domSy = (typeof window.pageYOffset == "number");
var idx = d.getElementsByTagName('div').length;

if (d.documentElement.style &&
typeof d.documentElement.style.MozOpacity == "string")
num = 12;

for (i = 0; i < num; i++){
sfs[i] = Math.round(1 + Math.random() * 1);

document.write('<div id="flake'+(idx+i)+'" style="position:absolute;top:0px;left:0px;width:'
+sfs[i]+'px;height:'+sfs[i]+'px;background-color:#ffffff;font-size:'+sfs[i]+'px"><\/div>');

currStep[i] = 0;
fall[i] = (sfs[i] == 1)?
Math.round(2 + Math.random() * 2): Math.round(3 + Math.random() * 2);
step[i] = (sfs[i] == 1)?
0.05 + Math.random() * 0.1 : 0.05 + Math.random() * 0.05 ;
}


if (domWw) r = window;
else{
 if (d.documentElement &&
 typeof d.documentElement.clientWidth == "number" &&
 d.documentElement.clientWidth != 0)
 r = d.documentElement;
 else{
 if (d.body &&
 typeof d.body.clientWidth == "number")
 r = d.body;
 }
}


function winsize(){
var oh,sy,ow,sx,rh,rw;
if (domWw){
 if (d.documentElement && d.defaultView &&
 typeof d.defaultView.scrollMaxY == "number"){
 oh = d.documentElement.offsetHeight;
 sy = d.defaultView.scrollMaxY;
 ow = d.documentElement.offsetWidth;
 sx = d.defaultView.scrollMaxX;
 rh = oh-sy;
 rw = ow-sx;
 }
 else{
 rh = r.innerHeight;
 rw = r.innerWidth;
 }
h = rh - 2; 
w = rw - 2;
}
else{
h = r.clientHeight - 2;
w = r.clientWidth - 2;
}
}


function scrl(yx){
var y,x;
if (domSy){
 y = r.pageYOffset;
 x = r.pageXOffset;
 }
else{
 y = r.scrollTop;
 x = r.scrollLeft;
 }
return (yx == 0)?y:x;
}


function snow(){
var dy,dx;

for (i = 0; i < num; i++){
 dy = fall[i];
 dx = fall[i] * Math.cos(currStep[i]);

 y[i]+=dy;
 x[i]+=dx;

 if (x[i] >= w || y[i] >= h){
 y[i] = -10;
 x[i] = Math.round(Math.random() * w);
 fall[i] = (sfs[i] == 1)?
 Math.round(2 + Math.random() * 2): Math.round(3 + Math.random() * 2);
 step[i] = (sfs[i] == 1)?
 0.05 + Math.random() * 0.1 : 0.05 + Math.random() * 0.05 ;
 }
 
 theFlakes[i].top = y[i] + scrl(0) + pix;
 theFlakes[i].left = x[i] + scrl(1) + pix;

 currStep[i]+=step[i];
}
setTimeout(snow,timer);
}


function init(){
winsize();
for (i = 0; i < num; i++){
 theFlakes[i] = document.getElementById("flake"+(idx+i)).style;
 y[i] = Math.round(Math.random()*h);
 x[i] = Math.round(Math.random()*w);
}
snow();
}


if (window.addEventListener){
 window.addEventListener("resize",winsize,false);
 window.addEventListener("load",init,false);

else if (window.attachEvent){
 window.attachEvent("onresize",winsize);
 window.attachEvent("onload",init);
}

})();
}//End.
</script>
Về Đầu Trang Go down
https://thuthuat.forum-viet.net
 
Javascript - Một số hiệu ứng tuyết rơi cho web
Về Đầu Trang 
Trang 1 trong tổng số 1 trang
 Similar topics
-
» Tuyệt chiêu download video chuẩn HD từ Youtube
» Hiệu ứng link cho blog
» Tạo hiệu ứng biến đổi hình ảnh độc đáo với FotoMorph
» Cách tìm kiếm hiệu quả trên Google
» Tìm hiểu về độ phân giải màng hình

Permissions in this forum:Bạn không có quyền trả lời bài viết
Thủ Thuật :: Thủ Thuật Webmaster-
Chuyển đến