Tạo popup thông báo bên góc màn hình đẹp đơn giản cho Blogspot

#Thủ Thuật #Windows #Blogger #Facebook

Tạo popup thông báo bên góc màn hình đẹp đơn giản cho Blogspot

Share:
Chào các bạn, nếu bạn đang có một vấn đề gì đó để thông báo với các độc giả trên blog của mình, mà không biết sử dụng code popup nào để tạo thông báo.
Xem Demo
Bài viết này mình sẽ hướng dẫn các bạn tạo một popup thông báo nhỏ, gọn bên góc màn hình kèm theo nút tắt để người khác có thể tắt nó sau khi đọc xong.

Các bước thực hiện

Bước 1. Chèn script vào trước thẻ </head>
<script type='text/javascript'>
function closeelement(){
div = document.getElementById(&quot;closeelement&quot;);div.style.display=&quot;none&quot;;}
setTimeout(closeelement, 9999999);
</script>
Bước 2. Chèn CSS và HTML vào sau thẻ <body>
<style>
#closeelement{position:fixed;z-index:9999999;bottom:30px;left:30px;padding:15px;background:#fff;border:4px solid #7577a9;width:500px;max-width:100%;font:400 20px Roboto;text-align:center;box-shadow:0 0 15px rgba(0,0,0,.1);transition:.5s}
#closeelement a{background:#7577a9;color:#fff;padding:5px 10px;position:absolute;right:-35px;top:-4px}</style>
<div id='closeelement'><a href='javascript:closeelement();'><i class='fa fa-times'/></a>Đây là demo, bấm vào button bên phải để tắt!<br/><b>bacsiwindows.com</b></div>
Bước 3. Lưu.

Tổng kết

Chỉ với một ít HTML và Javascript, bạn đã có một popup thông báo khá gọn nhẹ và đẹp gắn bên dưới góc màn hình cho Blogspot rồi nhé! :)
CHUYÊN MỤC

Bài Viết Liên Quan

Bình Luận Gần Đây

Một số lưu ý khi bình luận
● Mọi bình luận sai nội quy sẽ bị xóa mà không cần báo trước.
● Tích vào ô Thông báo cho tôi (Notify me) để nhận thông báo phản hồi của Admin.
● Không chửi tục, nói bậy, quảng cáo thông qua khung Comment.
● Để bình luận một đoạn code, hãy mã hóa code trước nhé.