Cũng đã lâu rồi mình chưa viết bài, cũng tại không có ý tưởng nào hay ho cả, cũng tại mình chưa có ý tưởng viết. Hôm nay mình sẽ chia sẻ đến cho các bạn cách Tạo popup thông báo khi vào trang cho các bạn nhé. Bắt đầu nào!
Bước 1:
Thêm code bên dưới vào trong thẻ body<div id='popup'> <div class='popup'> Chào mừng các bạn đến với <b>Tôi Viết Code</b>. <span class='close' onclick='checkPopup()'>x</span> </div> </div>
Bước 2:
Thêm CSS vào thẻ style#popup { position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 9999; background: rgba(0,0,0,.7); } #popup.active {display: none} #popup .popup { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 99999; width: 300px; padding: 30px; background: #fff; box-shadow: 0 3px 10px rgba(0,0,0,.2); -moz-box-shadow: 0 3px 10px rgba(0,0,0,.2); -webkit-box-shadow: 0 3px 10px rgba(0,0,0,.2); color: #333; font-size: 16px; line-height: 1.7; } .popup a { position: relative; padding-bottom: 1px; display: inline-block; } .popup a::after {content: ""; background: #337ab7; width: 100%; height: 1px; position: absolute; bottom: 0; left: 0} .popup .close { position: absolute; top: 10px; right: 10px; color: #fff; background: #000; border-radius: 100px; padding: 10px; cursor: pointer; text-decoration: none; }
Bước 3:
Thêm Javascript vào trong thẻ head<script tyle='text/javascript'> //<![CDATA[ var _0x9b3b = ["statusPopup", "getItem", "active", "toggleClass", "#popup", "click", ".close", "ready", "setItem", "removeItem"]; $(document)[_0x9b3b[7]](function () { var _0x9523x1 = sessionStorage[_0x9b3b[1]](_0x9b3b[0]); if (_0x9523x1 == 1) { $(_0x9b3b[4])[_0x9b3b[3]](_0x9b3b[2]) }; if (_0x9523x1 != 1) { $(_0x9b3b[6])[_0x9b3b[5]](function () { $(_0x9b3b[4])[_0x9b3b[3]](_0x9b3b[2]) }) } }); function checkPopup() { var _0x9523x1 = sessionStorage[_0x9b3b[1]](_0x9b3b[0]); if (_0x9523x1 == undefined) { sessionStorage[_0x9b3b[8]](_0x9b3b[0], 1) }; if (_0x9523x1 == 1) { sessionStorage[_0x9b3b[9]](_0x9b3b[0]); $(_0x9b3b[4])[_0x9b3b[3]](_0x9b3b[2]) } } //]]></script>
Lời kết
Các bạn có thể sử dụng thủ thuật trên để tạo thông báo mới cho member khi vào trang.Chúc các bạn thành công!
Pro nha 😂😂
Trả lờiXóaPro gì đâu, mơn nha
XóaVào lần đầu nó hiện, lần sau nó k hiện nữa hay s a
Trả lờiXóaVào các trang sau vẫn hiện nhé e, để phòng trường hợp member vào link khác trang chủ thì vẫn nhận đc thông báo
XóaCòn dư slot liên kết k a cho e đặt lk với
Trả lờiXóaCòn e
XóaĐã đặt cho a
Trả lờiXóaE bình luận thông tin blog nhé, rảnh a đặt cho
Xóavip thế nhờ =))
Trả lờiXóaThanks =))
Xóa