Tạo icon Thông Báo cực đẹp cho Blog-Website
Tạo icon Thông Báo cực đẹp cho Blog-Website. |
Thông Tin:
Code này được mình Rip từ BSW và edit lại,Code này cug không phải do bsw viết ra đâu nên mình rip không cần xin gì hết.
Ai lấy thì lấy, ko thui nha, đừng có nói lời cay đắng.
Hướng Dẫn :
Đầu tiên bạn cần thêm đoạn CSS để làm đẹp cho nó.
/*Tạo Icon Tin Nhắn Động PC4x*/
#notif-wrapper{position:fixed;width:100%;z-index:999}
.blanternotif{background:#7577a9;color:#FFF;width:50px;height:50px;border-radius:100%;position:fixed;z-index:999;bottom:45%;left:20px;-webkit-animation-duration:5s;-webkit-animation-iteration-count:infinite;-webkit-animation-name:notifklik;animation-duration:5s;animation-iteration-count:infinite;animation-name:notifklik;transition:all 5s ease-in-out}
.blanternotif i{color:#FFF;font-size:20px;margin:16px;-webkit-animation-duration:2s;-webkit-animation-iteration-count:infinite;-webkit-animation-name:notificon;animation-duration:2s;animation-iteration-count:infinite;animation-name:notificon;transition:all 2s ease-in-out}
Sau đó các bạn chèn đoạn này trên thẻ </body
<div id='notif-wrapper'>
<a class='blanternotif' href='javascript:;' title='Thông Báo'><i class='far fa-bell'></i></a>
<div class='notifbox'>
Hệ Thống Viplike-Tool Facebook Miễn Phí Cho Ai Cần Ngay Trên Thanh Menu!</div>
</div>
<script type='text/javascript'>
$(document).ready(function(){$(".blanternotif").click(function(){$(".notifbox,#notif-wrapper").toggleClass("aktif");});});
</script>
Nếu bạn không muốn nó xuất hiện trên giao diện điện thoại thì sử dụng Code này thay vì đoạn code trên.
<b:if cond='data:blog.isMobileRequest == "false"'>
<div id='notif-wrapper'>
<a class='blanternotif' href='javascript:;' title='Thông Báo'><i class='far fa-bell'></i></a>
<div class='notifbox'>
Hệ Thống Viplike-Tool Facebook Miễn Phí Cho Ai Cần Ngay Trên Thanh Menu!</div>
</div>
</b:if>
<script type='text/javascript'>
$(document).ready(function(){$(".blanternotif").click(function(){$(".notifbox,#notif-wrapper").toggleClass("aktif");});});
</script>
Mọi người Copy Code Xin Vui Lòng Để Nguồn idblanter Giúp Ạ, Tks!
Tags:
Blog