Tao mot chuoi cac ngoi sao bay theo Mouse

Nếu bạn sử dụng đúng những câu lệnh bên dưới khi bạn đưa mouse sát mép phải của màn hình thì chỉ xuất hiện thanh trượt ngang 1 ít xíu, có những chương trình khác hiệu ứng theo mouse nh[r]

(1)

T o m t chu i bay theo Mouse ộ ỗ Tạo Một chuỗi bay theo Mouse

Bạn nhìn thấy chuỗi ngơi bay theo mouse trang web chưa? Vâng, hiệu ứng mang lại từ chuỗi câu lệnh JavaScript nhúng vào trang web này, kết hợp với images để tạo nên hiệu ứng tuyệt vời bạn thấy

Nó biết phải ẩn mouse khơng hoạt động hoạt động trở lại mouse di chuyển Khi nhìn bạn tưởng chừng mouse đũa thần vẫy vậy! Chính hiệu ứng nhỏ vậy, làm cho trang web đỡ nhàm chán, tăng thêm phần hương vị

- Bạn copy đoạn mã bên dán vào Notepad, lưu lại thành đuôi htm html để phân tích, ngồi bên tơi cịn để Download 01, 02, 03, 04, 05, 06 ngơi muốn bạn download trang web này, lưu ý bạn phải đặt thư mục có tên Images, bên ngồi thư mục trang web có chứa đoạn mã bên

1 Ưu điểm việc nhúng trực tiếp Java Script vào webpage:

Đó tạo nên sinh động thực cho webpage bạn, làm cho khách đến thăm không cảm thấy nhàm chán Nếu bạn sử dụng câu lệnh bên bạn đưa mouse sát mép phải hình xuất trượt ngang xíu, có chương trình khác hiệu ứng theo mouse đưa mouse sát mép phải hình kéo theo trượt ngang theo dài, trang web tốt, điều cấm kỵ khơng xuất trượt ngang hình

2 Khuyết điểm:

Câu lệnh dài khiến trang web trở nên bị nặng, bạn dùng cho trang chủ có kích thước nhỏ, images cho vào

<TITLE>Hieu u'ng JavaScript - Le Quang Anh Hu'ng</TITLE>

(2)

<! Che dấu trình duyệt mà khơng biết JavaScript (ở sử dụng câu lệnh If else if) var version = 0;

if (navigator.userAgent.indexOf("MSIE 4") != -1) version = 5; else if (navigator.userAgent.indexOf("MSIE 3") != -1) version = 1; else if (navigator.userAgent.indexOf("Mozilla/4") != -1) version = 4; else if (navigator.userAgent.indexOf("Mozilla/4.5") != -1) version = 7; else if (navigator.userAgent.indexOf("Mozilla/3") != -1) version = 3; else if (navigator.userAgent.indexOf("Mozilla/2") != -1) version = 2; else if (navigator.userAgent.indexOf("MSIE 4.5") != -1) version = 6; else version = 8;

// > </SCRIPT>

<STYLE> <! Nơi dùng để tạo mẫu kích thước, vị trí cho Images(6 ngơi sao) > #trailsprite1 {

HEIGHT: 10px; LEFT: 0px; POSITION: absolute; TOP: 1px; VISIBILITY: visible; WIDTH: 10px; Z-INDEX: 100

}

#trailsprite2 {

}

(3)

}

#trailsprite4 {

}

#trailsprite5 {

}

#trailsprite6 {

}

</STYLE> </HEAD>

if (version > 3) <! Nếu ver > (JavaScript) xuất hình ảnh thứ thứ tự ứng với images bao gồm chiều cao, viền, tên, Id >

document.write('<div id="trailSprite1"><img

src="images/trailgif1.gif"height="10"width="10"border="0"name="trailSprite1img"></div><div id="trailSprite2"><img

(4)

id="trailSprite5"><img

src="images/trailgif6.gif"height="10"width="10"border="0"name="trailSprite6img"></div>') </SCRIPT>

<! NS4 = (("Netscape"==navigator.appName) && ("4"<=parseInt(navigator.appVersion)))

window.name = "right" <! Bạn phải cẩn thận chổ chữ "right" chỗ nguy hiểm chết người bạn không để ý frames bạn sổ tầm bậy liền đó, bạn ấn định để sổ frames tên phải đặt tên nghe! >

// > </SCRIPT>

<! var isNS = (navigator.appName == "Netscape"); layerRef = (isNS) ? "document" : "document.all"; styleRef = (isNS) ? "" : ".style";

var queue = new Array();var NUM_OF_TRAIL_PARTS = for (x=1; x < 7; x++)

{ ///////////////Image Preload

eval("trailSpriteFrame" + x + "=new Image(10,10);");

eval("trailSpriteFrame" + x + ".src='images/trailgif"+x+".gif';");

(5)

function trailSpriteObj(anID) {

this.trailSpriteID = "trailSprite" + anID; //Tùy đằng trước

this.imgRef = "trailSprite" + anID + "img"; //Chuyển tới tên sau this.currentFrame = 1; //nhìn thấy khung

this.animateTrailSprite = animateTrailSprite; //Khai báo phương pháp vòng lặp đối tượng }

function animateTrailSprite() {

if (this.currentFrame <7)

{// Nếu có hoạt cảnh (mà) khung rời bỏ, thay đổi kết cấu thời if (isNS)

{ //Phát duyệt thực chuyển đổi hình ảnh

eval("document['"+this.imgRef+"'].src=trailSpriteFrame" + this.currentFrame + ".src"); }

else {

eval("document['"+this.imgRef+"'].src=trailSpriteFrame" + this.currentFrame + ".src"); }

this.currentFrame ++; //và tăng thêm thời đối tượng hình ảnh }

(6)

{ //Khung hành đạt đến giới hạn che dấu eval(layerRef + '.' + this.trailSpriteID + styleRef + '.visibility="hidden"'); }

}///////////////////////////////////////////////////////////////// function processAnim()

{

for(x=0; x < NUM_OF_TRAIL_PARTS; x++) queue[x].animateTrailSprite();

}

function processMouse(e) {

currentObj = shuffleQueue(); if (isNS)

{

eval("document." + currentObj + ".left=e.pageX-0;"); eval("document." + currentObj + ".top=e.pageY+5;"); }

else {

eval("document.all." + currentObj + ".style.pixelLeft=event.clientX+document.body.scrollLeft-0;");

eval("document.all." + currentObj +

(7)

} }

function shuffleQueue() {

lastItemPos = queue.length - 1; lastItem = queue[lastItemPos]; for (i = lastItemPos; i>0; i ) queue[i] = queue[i-1]; queue[0] = lastItem;

queue[0].currentFrame = 1; //sự đặt lại số thứ tự hình ảnh đối tượng & làm cho ngơi rõ ràng thêm

eval(layerRef + '.' + queue[0].trailSpriteID + styleRef + '.visibility="visible"'); return queue[0].trailSpriteID;

}

function init() {

for(x=0; x<NUM_OF_TRAIL_PARTS; x++) //Sắp hàng đầy đủ vệt dài đối tượng queue[x] = new trailSpriteObj(x+1) ;

if (isNS) {

document.captureEvents(Event.MOUSEMOVE); }

(8)

setInterval("processAnim();",25); }

if (version > 3)

window.onload = init; // >

</SCRIPT> </body> </html>

<! -Kết thúc - >

Định dạng
Số trang	8
Dung lượng	12,11 KB