Cập nhật logo 
Phú Cường Blogger 
Niệm Style Blog 
Siin Blog 
Star Cường IT 
Bác Sĩ Windows 
Bạn tìm đến dòng <div id='header-top'> và cho toàn bộ đoạn code sau vào bên trên thẻ này :
Sau đó chèn đoạn code sau vào nơi bạn muốn hiển thị hộp :
<style> .icon-box{background-color:rgba(66,133,244,0.8);border-radius:100%;color:rgba(255,255,255,0.5);margin-right:8px} .icon-box:hover{color:white;background-color:rgba(66,133,244,1)} .notify-info{background-color:rgba(245,245,245,0.5);border:1px solid #eee;padding:5px 8px;margin-bottom:10px;margin-top:10px;cursor:pointer;text-align:left;font-size:15px;letter-spacing:0.3px;font-family:roboto}} .notify-info:hover{opacity:0.8;color:#138882} .notify-info p{font-size:11px;color:#555;margin:0;margin-top:-5px;padding-left:40px;line-height:1.5;} #notifybox{background:#fff;color:#333;font-size:13px;top:-1500px;right:150px;padding:20px;position:absolute;width:320px;box-shadow:0 1px 5px rgba(0,0,0,.1);z-index:9998;transition:all .5s} .closebox{background:none;border:none;position:absolute;top:0;right:0;cursor:pointer;font-size:18px;font-weight:700;color:#888;padding:4px 6px} .minimizebox{background:none;border:none;position:absolute;top:-9px;right:20px;cursor:pointer;font-size:18px;font-weight:700;color:#888!important;padding:4px 6px} .minimizebox:hover{color:rgba(254,109,70,0.9)!important}.closebox:hover{color:rgba(254,109,70,0.9)!important} #myModal{position:absolute;top:-1550px;z-index:9999;transition:all .4s} .modal.in .modal-dialog{-webkit-transform:translate(0,0);-ms-transform:translate(0,0);transform:translate(0,0)} .modal.fade .modal-dialog{-webkit-transition:-webkit-transform .3s ease-out;-moz-transition:-moz-transform .3s ease-out;-o-transition:-o-transform .3s ease-out;transition:transform .3s ease-out;-webkit-transform:translate(0,-25%);-ms-transform:translate(0,-25%);transform:translate(0,-25%)} .modal-content{position:relative;background:#fff;background-clip:padding-box;outline:none;box-shadow:0 2px 5px rgba(0,0,0,.1);right:150px;padding:20px;position:fixed;width:320px;margin-top:-30px;margin-bottom:30px;} .modal-header{min-height:16.42857143px;padding:15px;border-bottom:1px solid #e5e5e5;color:#138882} .modal-header .close{margin-top:-2px} button.close{-webkit-appearance:none;padding:0;cursor:pointer;background:transparent;border:0} .close{float:right;font-size:21px;font-weight:700;line-height:1;color:#000;text-shadow:0 1px 0 #fff;filter:alpha(opacity=20);} .modal-title{margin:0;font-size:120%;font-weight:400;text-align:center;letter-spacing: 0.3px;} .modal-body{position:relative;padding:0;text-align:left;min-height:150px;} .modal-body p{line-height:1.5;letter-spacing: 0.1px;font-family: roboto;} .modal-footer{padding:19px 20px 20px;margin-top:15px;text-align:right;border-top:1px solid #e5e5e5} .btn-primary{background:#138882;color:#fff;border:0;display:table;width:100%;max-width:170px;position:relative;padding:12px 15px;font-size:90%;text-transform:uppercase;margin:auto;letter-spacing:1px;border-radius:5px} .btn-primary:hover{background:#fff;color:#138882;box-shadow:0 0 5px rgba(81,203,238,0.7);} .circle{padding:2px 6px;background:#138882;border-radius:100%;color:#fff;margin:0 15px 0 0;font-size:14px;font-weight:600;font-family:helvetica} #overlay{background:transparent;z-index:9999;position:absolute;top:0;left:0;right:0;bottom:0;display:none} .social-sec ul#social a.notify-box:hover{background-color:green} li a.notify-box:after{text-align: center;position:absolute;content:'4';right:-5px;top:-5px;background:#f56954;color:#fff;padding:0;width:15px;height:15px;line-height:15px;border:2px solid #fff;border-radius:100%;font-size:80%;transform:scale(1.0);transition:all .3s ease;} .social-sec ul li a.notify-box:hover:after{transform:scale(0.9)} .social-sec .notify-box:before{content:"\f06b"} .ani{animation:mation 2s ease-in infinite} @keyframes mation{48%,62%{transform:scale(1.0,1.0)}50%{transform:scale(1.1,0.9)}56%{transform:scale(0.9,1.1) translate(0,-5px)}59%{transform:scale(1.0,1.0) translate(0,-3px)}} </style> <div id='notifybox' style='position:fixed;right:76px;'> <div class='notify-info info' id='notify1' onclick='document.getElementById('myModal').style.top='80px';document.getElementById('overlay').style.display='block';'><i class='fa fa-info icon-box' style='padding: 10px 15px;'></i>Có gì mới trên Star Nhân IT</div> <div class='notify-info' id='notify2' onclick='window.open('/lienket');'><i class='fa fa-slideshare icon-box' style='padding: 10px;background-color:#ffa812;'></i>Đặt Liên Kết</div> <div class='notify-info' id='notify3' onclick='window.open('https://www.facebook.com/LTAIT.Official');'><i class='fa fa-key icon-box' style='padding: 10px;background-color:#96d726;'></i>Liên Hệ Quảng Cáo - Báo Lỗi</div> <div class='notify-info' id='notify4' onclick='window.open('https://www.starcuongit.com/2018/01/event-co-thuong-tri-an-nhung-doc-gia-tich-cuc-binh-luan.html');'><i class='fa fa-gift icon-box' style='padding: 10px;background-color:#fe6d46;'></i>Event Tri Ân Top Bình Luận</div> <input class='closebox' onclick='document.getElementById('notifybox').style.top='-381px';document.getElementById('notify').style.display='none';' title='Đóng thông báo' type='button' value='×'/> <input class='minimizebox' onclick='document.getElementById('notifybox').style.top='-381px';' title='Thu nhỏ thông báo' type='button' value='_'/> </div> <div id='overlay'></div> <div class='modal-dialog' id='myModal'> <div class='modal-content'> <div class='modal-header'> <h4 class='modal-title' id='myModalLabel1'> Cập nhật mới trên Star Nhân IT</h4> </div> <div class='modal-body'> <p><span class='circle'>1</span>Nâng cấp giao diện thân thiện, đẹp mắt.</p> <p><span class='circle'>2</span>Thêm Slide Chuyên Mục cho trang chủ.</p> <p><span class='circle'>3</span>Nâng cấp giao diện comment đẹp và nhỏ gọn hơn</p> <p><span class='circle'>4</span>Tối ưu tốc độ tải trang và sửa một số lỗi nhỏ khác.</p> </div> <div class='modal-footer'> <button class='btn-primary' onclick='document.getElementById('myModal').style.top='-800px';document.getElementById('overlay').style.display='none';document.getElementById('notif1').style.top='-800px';' type='button'>Đóng</button> </div> </div> </div>
<li id='notify'><a class='notify-box ani' href='#notify' onclick='document.getElementById('notifybox').style.top='50px';document.getElementById('count-box').style.display='none';'><span class='inv'></span></a></li>Nguồn Code : Star Cường IT
Thích
0 bình luận
Hashtag:
#Thủ Thuật Blogspot
Bạn và người khác
