Blogger

Share code banner tự động tắt sau thời gian nhất định

Mình vào thẳng cách thực hiện luôn nhé :) Thêm đoạn code sao vào trên ]]></b:skin> #notifjo { right: 10px; /* posisi di paling kanan */ bottom: 10px;/* posisi di paling atas */ width: 300px;…

Hung.Pro.VN

Developer Windows

---

• 21/04/2016
• Views

• #Blogger
• #HTML
• #Javascript

Mình vào thẳng cách thực hiện luôn nhé :)

Thêm đoạn code sao vào trên ]]></b:skin>

#notifjo { right: 10px; /* posisi di paling kanan */ bottom: 10px;/* posisi di paling atas */ width: 300px; /* lebar notif */ height: 250px; /* tinggi notif otomatis */ overflow: hidden; background: white; /* warna background */ border-radius: 5px; /* nilai sudut bundar */ border: 1px solid #ddd; /* garis batas luar */ z-index: 999999; position: fixed; /* posisi melayang */ -webkit-animation: fadeOutnotif 20s linear forwards; /* notif 10 detik */ -moz-animation: fadeOutnotif 30s linear forwards; -o-animation: fadeOutnotif 30s linear forwards; -ms-animation: fadeOutnotif 30s linear forwards; animation: fadeOutnotif 60s linear forwards; } #notifjo a { display:block; text-decoration:none;} #notifjo span { display: block; padding: 15px 15px; pointer-events: none; text-align: left; float: left; } #notifjo span h2 { font-size: 12px; /* Ukuran text */ line-height: 21px; color: #222; /* Warna text */ font-weight: normal; letter-spacing: 0px; } /* Blog johanes djogzs.blogspot.com */ @-webkit-keyframes fadeOutnotif { 0% { opacity: 1;} 10% { opacity: 1;} 90% { opacity: 1; -webkit-transform: translateY(0px);} 99% { opacity: 0; -webkit-transform: translateY(-30px);} 100% { opacity: 0;} } @-moz-keyframes fadeOutnotif { 0% { opacity: 1;} 10% { opacity: 1;} 90% { opacity: 1; -moz-transform: translateY(0px);} 99% { opacity: 0; -moz-transform: translateY(-30px);} 100% { opacity: 0;} } @-o-keyframes fadeOutnotif { 0% { opacity: 1;} 10% { opacity: 1;} 90% { opacity: 1; -moz-transform: translateY(0px);} 99% { opacity: 0; -moz-transform: translateY(-30px);} 100% { opacity: 0;} } @-ms-keyframes fadeOutnotif { 0% { opacity: 1;} 10% { opacity: 1;} 90% { opacity: 1; -moz-transform: translateY(0px);} 99% { opacity: 0; -moz-transform: translateY(-30px);} 100% { opacity: 0;} } @keyframes fadeOutnotif { 0% { opacity: 1;} 10% { opacity: 1;} 90% { opacity: 1; -moz-transform: translateY(0px);} 99% { opacity: 0; -moz-transform: translateY(-30px);} 100% { opacity: 0; }

Thêm đoạn code sao vào HTML mới

<div id='notifjo'> <center> Code Quảng Cáo Của Bạn Tại Đây </center> </div>

Bạn nào muốn xem DEMO thì ở phía ngoài trang chủ hoặc các trang khác của mình đều có nhé ^^.
Chúc các bạn thành công
Các bạn copy vui lòng ghi rỏ nguồn bài viết thuộc về BomKhung.Net

Previous post

Share code banner tự động tắt sau thời gian nhất định

Next post

Share code banner tự động tắt sau thời gian nhất định

Related post

---

Hung.Pro.VN

Nhà thiết kế Web

View Articles

Tôi là admin trang Hung.Pro.VN là một người có đam mê với Blogspot, kinh nghiệm 5 năm thiết kế ra hàng trăm mẫu Template blogpsot như" Bán hàng, bất động sản, landing page, tin tức...

Share this article