80s toys - Atari. I still have

Thông báo

Chào mừng bạn ghé thăm wap TatCa.Yn.Lt của chúng tôi!
Nếu bạn phát hiện thấy có gì bất thường như (vi phạm bản quyền, link die, lỗi code...).
Hãy thông báo cho Admin tại nhóm FaceBook hoặc kênh YouTube: Shared Channel biết để khắc phục ngay...
Chân thành cảm ơn và chúc vui vẻ..!

Tiện ích

Loading...

Tìm kiếm nhanh

Trang chủ > Chia sẻ code hay và "độc"

Tìm kiếm|Đang Online: (1)

↓↓ Tạo Hiệu Ứng Tuyết Rơi Cho Web/Wap/Blog Bằng CSS3 Animation

Duy_Doanh

23:15, 16/12/2016

XtCAT -:- 404 0: php_network_getaddresses: getaddrinfo failed: Name or service not known

Advertise Here

404 - Page Not Found - Back Home

Total Visits: 44741988
Visits Today: 9686
This Week: 1170310
This Month: 10557336

This site, is built entirely by using XtGem.

XtGem is a visual mobile site building tool, allowing users to create and maintain highly customizable personal mobile sites completely free of charge - and without a need to know any programming language at all!

lượt xem

Sắp đến giáng sinh rồi, chúng ta cũng nên trang trí cho trang wap/web/blog của mình sinh động hơn tí nhỉ?
Không như những code truyền thống chúng ta phải sử dụng Javascript khá lằng nhằng và phức tạp để tạo nên hiệu ứng tuyết rơi cho wap/web/blog. Nhược điểm là khi chạy sẽ làm nặng trang và đơ đơ rất khó chịu.
Với sự phát triển của css3 thì việc tạo nên hiệu ứng tuyết rơi trở nên đơn giản hơn bằng Animation.

Code này có thể áp dụng cho mọi trang wap/web/blog... Các bạn cứ post bên trên thẻ body là được.
Tạo hiệu ứng bông tuyết rơi cho trang Blopspot CSS3 Snow Animation, Bạn sẽ có một website lung linh đón giáng sinh đấy!

Demo: http://tatca.yn.lt/test/tuyet-roi

Demo ảnh:

ảnh minh họa

Tải ảnh gốc

Vào việc chính thôi.

Trước tiên copy code này dán vào chỗ nào bạn muốn trong wap/web/blog bạn cũng được.

Code:

Khung Copy

Bước 2 bạn copy code này thêm vào CSS wap/web/blog của bạn nhé.

Code:

Khung Copy

<style type="text/css">
.snow-container{position:fixed;width:100%;max-width:100%;z-index:99999;pointer-events:none;overflow:hidden;top:0;height:100%}
.snow{display:block;position:absolute;z-index:2;top:0;right:0;bottom:0;left:0;pointer-events:none;-webkit-transform:translate3d-100;transform:translate3d-100;-webkit-animation:snow linear infinite;animation:snow linear infinite}
.snow.foreground{background-image:url"http:;-webkit-animation-duration:15s;animation-duration:10s}
.snow.foreground.layered{-webkit-animation-delay:7.5s;animation-delay:7.5s}
.snow.middleground{background-image:urlhttp:;-webkit-animation-duration:20s;animation-duration:15s}
.snow.middleground.layered{-webkit-animation-delay:10s;animation-delay:10s}
.snow.background{background-image:urlhttp:;-webkit-animation-duration:25s;animation-duration:20s}
.snow.background.layered{-webkit-animation-delay:12.5s;animation-delay:12.5s}
@-webkit-keyframes snow{0%{-webkit-transform:translate3d-100;transform:translate3d-100}100%{-webkit-transform:translate3d5;transform:translate3d5}}
@keyframes snow{0%{-webkit-transform:translate3d-100;transform:translate3d-100}100%{-webkit-transform:translate3d5;transform:translate3d5}}
</style>

Bước 3 là xem thành quả thôi...

Chúc thành công..!

↑↑ Đánh giá bài viết

XtCAT -:- 404 0: php_network_getaddresses: getaddrinfo failed: Name or service not known

Advertise Here

404 - Page Not Found - Back Home

Total Visits: 44741998
Visits Today: 9696
This Week: 1170320
This Month: 10557346

This site, is built entirely by using XtGem.

XtGem is a visual mobile site building tool, allowing users to create and maintain highly customizable personal mobile sites completely free of charge - and without a need to know any programming language at all!

XtCAT -:- 404 0: php_network_getaddresses: getaddrinfo failed: Name or service not known

Advertise Here

404 - Page Not Found - Back Home

Total Visits: 44742003
Visits Today: 9701
This Week: 1170325
This Month: 10557351

This site, is built entirely by using XtGem.

XtGem is a visual mobile site building tool, allowing users to create and maintain highly customizable personal mobile sites completely free of charge - and without a need to know any programming language at all!

XtCAT -:- 404

0: php_network_getaddresses: getaddrinfo failed: Name or service not known

Advertise Here

404 - Page Not Found - Back Home

Total Visits: 44742008
Visits Today: 9706
This Week: 1170330
This Month: 10557356

This site, is built entirely by using XtGem.

XtGem is a visual mobile site building tool, allowing users to create and maintain highly customizable personal mobile sites completely free of charge - and without a need to know any programming language at all!

.png" alt="sao" />

Chia sẻ bài viết ???

- Chia sẻ tới:

-

-

-

BBCode:

Link:

XtCAT -:- 404 0: php_network_getaddresses: getaddrinfo failed: Name or service not known

Advertise Here

404 - Page Not Found - Back Home

Total Visits: 44742011
Visits Today: 9709
This Week: 1170333
This Month: 10557359

This site, is built entirely by using XtGem.

XtGem is a visual mobile site building tool, allowing users to create and maintain highly customizable personal mobile sites completely free of charge - and without a need to know any programming language at all!

Cùng chuyên mục

● Tạo hiệu ứng hoa mai, hoa đào rơi cho Wap/Web/Blog

● Chia sẻ code Ông già Noel để trang trí giáng sinh cho Wap/Web/Blog

● Hướng dẫn tạo pháo hoa cực đẹp mừng năm mới cho Wap/Web/Blog

● Code hiệu ứng sao rơi đẹp

● Tạo Hiệu Ứng Tuyết Rơi Cho Web/Wap/Blog Bằng CSS3 Animation

Bạn đã xem chưa?

● Vũ trụ thuở sơ khai

● Xem hoa tay ở 2 bàn tay đoán tính cách

● Chiếc cầu phúc đức

● Những Điều Thú Vị Về Mặt Trời Có Thể Bạn Chưa Biết

● Truyện cười con trai

Đầu trang - Giới thiệu - Điều khoản - Chính sách - Liên hệ FB

Thống kê truy cập