Go Back   VN-Zoom forum > Chia sẻ kiến thức > Lập trình

 

Trả lời
 
Ðiều Chỉnh Xếp Bài
Old 07-04-2008, 13:40   #1
Rìu Chiến
 
HOANG ANH's Avatar
 
Tham gia: Aug 2007
Bài: 1.719
VZD: 132.268
Điểm: 3.192/1.070 bài viết
Default Tạo Một Trận Sao Rơi Bằng JavaScript

Tạo Một Trận Sao Rơi Bằng JavaScript
Ở đây tôi mạn phép dùng ánh sao vì bông tuyết tôi không có, nếu bạn có bông tuyết cho vào, tất nhiên bông tuyết phải lớn hơn sao nhiều và thay nền đen thành nền trắng thì sẽ trở nên một trận Tuyết rơi rồi đó.

Bạn thấy tuyết rơi bao giờ chưa, riêng tôi thì chỉ được nhìn thấy trên màn hình TV. Những bông tuyết rơi ngoài trời ở các nước theo tôi nghĩ chắc là.đẹp lắm, Tôi hy vọng một ngày nào đó khi tàu của tôi ghé thăm một cảng nào đó có tuyết rơi chắc cũng phần nào đó an ủi. Vậy làm sao để tạo một trận tuyết rơi rầm rộ trên màn hình, khi nó rơi gần đến cuối màn hình thì từ từ biến mất. Những trận tuyết rơi như vậy thường diễn ra vào mùa đông (Giáng Sinh) khi nào sắp đến mùa đông bạn hãy trang hoàn cho trang web của bạn có cảnh tuyết đang rơi như vậy thì rất mới lạ và.đẹp mắt nữa chứ, phải không các bạn?

Các bạn hãy nhúng đoạn Java Script bên dưới vào trang web của bạn đồng thời kết hợp với 1 image. Mức độ tương thích trình duyệt rất tốt, nó có thể tương thích với cả 2 trình duyệt Internet Explorer & Netscape Navigator. Bạn hãy copy đoạn Java Script dán vào Notepad sau đó lưu lại thành file có đuôi .htm hoặc .html.

Các bạn lưu ý: Khi tạo 1 image này các bạn cần tạo image này càng nhẹ nhàng chừng nào thì bông tuyết gơi càng nhẹ nhàng và uyển chuyển chừng đó, image này phải đạt mức độ trong suốt, kích thước bức ảnh càng nhỏ thì càng đỡ phải che mất chữ của bạn.

<html>

<head>

<title>Hieu Ung JavaScript Tuyet Dang Roi - Le Hu'ng Homepage</title>

</head>

<body>

<center>
<SCRIPT LANGUAGE="JavaScript1.2">


<!-- Begin

var no = 25; // Số tuyết

var speed = 10; // Số càng nhỏ tuyết di chuyển(rơi) càng nhanh

var snowflake = "images/idcs.gif"; // Nơi đây chèn hình bông tuyết

var ns4up = (document.layers) ? 1 : 0; // Bộ duyệt tìm nạp vào

var ie4up = (document.all) ? 1 : 0;

var dx, xp, yp; // tọa độ và những vị trí thay đổi

var am, stx, sty; // Độ rộng và những bước thay đổi

var i, doc_width = 800, doc_height = 600;

if (ns4up) {

doc_width = self.innerWidth;

doc_height = self.innerHeight;

} else if (ie4up) {

doc_width = document.body.clientWidth;

doc_height = document.body.clientHeight;

}

dx = new Array();

xp = new Array();

yp = new Array();

am = new Array();

stx = new Array();

sty = new Array();

for (i = 0; i < no; ++ i) {

dx[i] = 0; // những biến đổi toạ độ tập hợp

xp[i] = Math.random()*(doc_width-50); // tập hợp những thay đổi vị trí

yp[i] = Math.random()*doc_height;

am[i] = Math.random()*20; // tập hợp những thay đổi độ rộng

stx[i] = 0.02 + Math.random()/10; // tập hợp những thay đổi bước

sty[i] = 0.7 + Math.random(); //tập hợp những thay đổi bước

if (ns4up) { // những lớp tập hợp

if (i == 0) {

document.write("<layer name=\"dot"+ i +"\" left=\"15\" ");

document.write("top=\"15\" visibility=\"show\"><img src=\"");

document.write(snowflake + "\" border=\"0\"></layer>");

} else {

document.write("<layer name=\"dot"+ i +"\" left=\"15\" ");

document.write("top=\"15\" visibility=\"show\"><img src=\"");

document.write(snowflake + "\" border=\"0\"></layer>");

}

} else if (ie4up) {

if (i == 0) {

document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");

document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");

document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"");

document.write(snowflake + "\" border=\"0\"></div>");

} else {

document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");

document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");

document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"");

document.write(snowflake + "\" border=\"0\"></div>");

}

}

}

function snowNS() { // hàm Netscape hoạt cảnh chính

for (i = 0; i < no; ++ i) { // vòng lặp cho mỗi điểm

yp[i] += sty[i];

if (yp[i] > doc_height-50) {

xp[i] = Math.random()*(doc_width-am[i]-30);

yp[i] = 0;

stx[i] = 0.02 + Math.random()/10;

sty[i] = 0.7 + Math.random();

doc_width = self.innerWidth;

doc_height = self.innerHeight;

}

dx[i] += stx[i];

document.layers["dot"+i].top = yp[i];

document.layers["dot"+i].left = xp[i] + am[i]*Math.sin(dx[i]);

}

setTimeout("snowNS()", speed);

}

function snowIE() { // hàm IE hoạt cảnh chính

for (i = 0; i < no; ++ i) { // vòng lặp cho mỗi điểm

yp[i] += sty[i];

if (yp[i] > doc_height-50) {

xp[i] = Math.random()*(doc_width-am[i]-30);

yp[i] = 0;

stx[i] = 0.02 + Math.random()/10;

sty[i] = 0.7 + Math.random();

doc_width = document.body.clientWidth;

doc_height = document.body.clientHeight;

}

dx[i] += stx[i];

document.all["dot"+i].style.pixelTop = yp[i];

document.all["dot"+i].style.pixelLeft = xp[i] + am[i]*Math.sin(dx[i]);

}

setTimeout("snowIE()", speed);

}

if (ns4up) {

snowNS();

} else if (ie4up) {

snowIE();

}

// End -->

</script>
</body>


</html>
<!-- ---------------------------------------------------- Kết Thúc -------------------------------------------------- -->

Theo echip
HOANG ANH vẫn chưa có mặt trong diễn đàn   Trả Lời Với Trích Dẫn
Old 11-04-2008, 07:02   #2
Gà Con
 
muabuon_tvt's Avatar
 
Tham gia: Apr 2008
Bài: 4
VZD: 267
Điểm: 0/0 bài viết
Default làm bạn nha!

bài nầy cũng được nhưng tiếc là bạn ko cho mình mấy cái "sao", vậy là mình phải design mấy cái sao đó à?
muabuon_tvt vẫn chưa có mặt trong diễn đàn   Trả Lời Với Trích Dẫn
Trả lời

Ðiều Chỉnh
Xếp Bài

Quyền Sử Dụng Ở Diễn Ðàn
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is Mở
Smilies đang Mở
[IMG] đang Mở
HTML đang Tắt
Trackbacks are Tắt
Pingbacks are Tắt
Refbacks are Tắt
Chuyển đến


Múi giờ GMT +7. Hiện tại là 18:24.


Powered by vBulletin® Version 3.7.3
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
vBCredits v1.4 Copyright ©2007 - 2008, PixelFX Studios
Từ điển được cung cấp bởi VDict.com - Hosting được tài trợ bởi Rao vặt 123