Sau đây là hiệu ứng tuyết rơi, tim rơi, @ rơi, hay ...bất cứ ký tự nào rơi mà bạn muốn
Đây là một đoạn mã mà tôi tình cờ gặp khi vào blog của thành viên kitty trong VnVista 
Để sử dụng hiệu ứng này, bạn chỉ cần sửa một khối bất kỳ trên blog của bạn mà bạn đã tạo ra (hoặc tạo một khối mới nếu bạn chưa có khối nào do bạn tự tạo). Trong phần nội dung khối này, ở cuối bạn chèn thêm đoạn HTML sau.
Nếu bạn đang sử dụng trình soạn thảo rich text, thì bạn cần phải click vào nút 
để xem mã HTML của bài viết & chèn đoạn mã dưới đây ở cuối & click OK. Còn nếu bạn sử dụng trình soạn thảo đơn giản (bbcode) thì chỉ việc chèn vào cuối nội dung trong khung soạn thảo là đượcCODE
<div style='color:red; font-size:10px;'>
<marquee style='position:absolute; left: 53px; top: 200px; width: 16px; height: 260px;' scrollamount='2' direction='down'>♥</marquee><marquee style='position:absolute; left: 81px; top: 160px; width: 16px; height: 280px;' scrollamount='5' direction='down'>♥</marquee><marquee style='position:absolute; left: 120px; top: 190px; width: 16px; height: 270px;' scrollamount='3' direction='down'>♥</marquee><marquee style='position:absolute; left: 179px; top: 200px; width: 16px; height: 270px;' scrollamount='3' direction='down'>♥</marquee><marquee style='position:absolute; left: 207px; top: 210px; width: 16px; height: 160px;' scrollamount='2' direction='down'>♥</marquee><marquee style='position:absolute; left: 257px; top: 210px; width: 16px; height: 330px;' scrollamount='1' direction='down'>♥</marquee><marquee style='position:absolute; left: 300px; top: 160px; width: 16px; height: 480px;' scrollamount='5' direction='down'>♥</marquee><marquee style='position:absolute; left: 331px; top: 150px; width: 16px; height: 200px;' scrollamount='1' direction='down'>♥</marquee><marquee style='position:absolute; left: 366px; top: 200px; width: 16px; height: 360px;' scrollamount='4' direction='down'>♥</marquee><marquee style='position:absolute; left: 411px; top: 250px; width: 16px; height: 400px;' scrollamount='4' direction='down'>♥</marquee><marquee style='position:absolute; left: 436px; top: 150px; width: 16px; height: 460px;' scrollamount='2' direction='down'>♥</marquee><marquee style='position:absolute; left: 505px; top: 170px; width: 16px; height: 290px;' scrollamount='3' direction='down'>♥</marquee><marquee style='position:absolute; left: 541px; top: 190px; width: 16px; height: 350px;' scrollamount='5' direction='down'>♥</marquee><marquee style='position:absolute; left: 582px; top: 160px; width: 16px; height: 400px;' scrollamount='1' direction='down'>♥</marquee><marquee style='position:absolute; left: 595px; top: 210px; width: 16px; height: 350px;' scrollamount='2' direction='down'>♥</marquee><marquee style='position:absolute; left: 645px; top: 220px; width: 16px; height: 400px;' scrollamount='4' direction='down'>♥</marquee><marquee style='position:absolute; left: 685px; top: 180px; width: 16px; height: 450px;' scrollamount='1' direction='down'>♥</marquee><marquee style='position:absolute; left: 740px; top: 210px; width: 16px; height: 470px;' scrollamount='2' direction='down'>♥</marquee><marquee style='position:absolute; left: 775px; top: 230px; width: 16px; height: 370px;' scrollamount='4' direction='down'>♥</marquee><marquee style='position:absolute; left: 800px; top: 150px; width: 16px; height: 150px;' scrollamount='5' direction='down'>♥</marquee><marquee style='position:absolute; left: 860px; top: 210px; width: 16px; height: 400px;' scrollamount='3' direction='down'>♥</marquee><marquee style='position:absolute; left: 891px; top: 190px; width: 16px; height: 350px;' scrollamount='4' direction='down'>♥</marquee><marquee style='position:absolute; left: 943px; top: 160px; width: 16px; height: 240px;' scrollamount='1' direction='down'>♥</marquee><marquee style='position:absolute; left: 978px; top: 250px; width: 16px; height: 170px;' scrollamount='5' direction='down'>♥</marquee>
</div>
Rồi save lại. Vậy là xong!
Vào lại blog bạn để xem hiệu ứng.
Nếu bạn muốn chỉnh sửa hiệu ứng này theo ý bạn (rất đơn giản), bạn chỉ cần chú ý những điểm sau:
- Đoạn mã được mở đầu bằng dòng:
CODE
<div style='color:red; font-size:10px;'>
Nếu bạn muốn trái tim có màu khác màu đỏ thì chỉ việc thay chữ
red ở dòng này. Nếu bạn muốn trái tim lớn hơn thì chỉ việc nhập một số lớn hơn 10 ở phần font-size:10px;
- Tiếp theo chỉ là hàng loạt các dòng kiểu như:
CODE
<marquee style='position:absolute; left: 978px; top: 250px; width: 16px; height: 170px;' scrollamount='5' direction='down'>♥</marquee>
Mỗi dòng này sẽ tạo ra một trái tim rơi trên blog bạn, do đó, nếu bạn muốn thay hiệu ứng trái tim rơi bằng một ký tự khác rơi, thì chỉ việc thay hết các ký tự ♥ trong đoạn trên bằng ký tự khác. Vd:
* (tuyết rơi), ♪ , ♫ , ☼, ♀, ♂, ○ , o, •, ♠, ♣, ♦, ♥, ☻, ☺, ■, . , ▓ , ↓ , † (copy các ký tự này nếu bạn ko biết cách gõ)
Ngoài ra, trong phần <marquee style='position:absolute; left: 978px; top: 250px; width: 16px; height: 170px;' scrollamount='5' direction='down'>, còn một số thông số khác:
left: 978px; top: 250px; -> Trái tim bắt đầu rơi cách cạnh trái màn hình 978px, cách cạnh trên màn hình 250px (nếu bạn đang dùng màn hình độ phân giải 800x600px thì khoảng cách này sẽ làm blog bạn bị kéo dài ra theo chiều ngang)
height: 170px; - Quãng đường đi của trái tim là 170px
scrollamount='5' - Tốc độ rơi của trái tim (số càng lớn rơi càng nhanh)
direction='down' - Trái tim di chuyển xuống dưới (rơi) chứ ko sang trái, phải hay lên trên (thay down bằng left, right, up nếu bạn muốn thử
)
Thật đơn giản phải không?
-----------
À kitty mới bảo rằng, để tạo đoạn mã như trên, bạn chỉ cần vào trang này:http://www.pimp-my-profile.com/codes/raining-symbols.php
Bài viết đã được chỉnh sửa bởi Tacaza: Dec 15 2006, 04:30 AM 
VnVista Forum > Bản tin diễn đàn - Board Communication Center > Hướng dẫn sử dụng website > Mọi điều về web cá nhân (blog) VnVista
Dec 15 2006, 03:51 AM
