Thẻ lưu trữ: Hiệu ứng tuyết rơi

hieu-ung-tuyet-roi-cho-trang-web

Hướng dẫn tạo hiệu ứng tuyết rơi cho website

Sau đây là hướng dẫn ngắn gọn giúp website của bạn mang một phong cách mùa đông, phù hợp với không khí mùa Noel. Cụ thể trong hướng dẫn này sẽ giúp bạn tạo hiệu ứng tuyết rơi nhẹ nhàng và đẹp mắt mà không cần tốn nhiều thời gian và công sức.

Đầu tiên là bạn cần download file jquery sau về và chèn vào website bạn:

http://zkiwi.com/libs/js/snow.js

Tiếp theo là bạn download các bông tuyết: img.rar

Bạn có thể xây dựng cấu trúc HTML tương tự như bên dưới:

<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Your Web</title>
<script src="http://zkiwi.com/libs/js/snow.js" type="text/javascript"></script>
<script type="text/javascript">
   createSnow('http://zkiwi.com/libs/imgs/snow/', 30);
</script>
</head>

<body>
Nội dung trang web của bạn
</body>
</html>

Trong đó có đoạn Javascript createSnow('http://zkiwi.com/libs/imgs/snow/', 30); thực thi hiệu ứng. Bạn nhớ thay đổi đường dẫn chứa hình các bông tuyết và số bông tuyết xuất hiện (ở đây là 30), lưu ý số bông tuyết bạn đừng để quá nhiều vì sẽ ảnh hưởng đến việc load trang. Ngoài ra bạn cũng có thể tự thiết kế các bông tuyết theo ý bạn muốn.

Bạn có thể tham khảo Demo hoặc download toàn bộ filde mã nguồn về xử dùng cho trang web bạn. Chúc bạn thành công.