Sticky Ads & Stick Div Ứng Dụng Tạo Thông Báo, Quảng Cáo với nút tắt ( Close )

Mẫu Code Sticky Ads & Stick Div Ứng Dụng Tạo Thông Báo, Quảng Cáo với nút tắt ( Close ) chân trang ( bottom & footer ) :

 <style>
/* Sticky Ads */
.sticky-buttonBottomAd-GiaBaoBlog{position:fixed;bottom:0;right:20px;width:50px;height:50px;border-radius:50px;background-color:#fdd929;box-shadow:0px 4px 12px 0 rgba(9,32,76,.05);z-index:20;overflow:hidden;-webkit-transition:all .2s ease;transition:all .2s ease;opacity:0;visibility:hidden}
.sticky-buttonBottomAd-GiaBaoBlog.sticky{bottom:20px;opacity:1;visibility:visible}
.sticky-buttonBottomAd-GiaBaoBlog > *{display:flex;align-items:center;height:100%}
.sticky-buttonBottomAd-GiaBaoBlog > * svg{margin:auto;fill:inherit}
.sticky-adBottomAd-GiaBaoBlog{position:fixed;bottom:0;left:0;width:100%;min-height:70px;max-height:200px;padding:5px 0;box-shadow:0 -6px 18px 0 rgba(9,32,76,.1);-webkit-transition:all .1s ease-in;transition:all .1s ease-in;display:flex;align-items:center;justify-content:center;background-color:#fefefe;z-index:20}
.sticky-adBottomAd-GiaBaoBlog .sticky-adBottomAd-GiaBaoBlogClose{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:12px 0 0;position:absolute;right:0;top:-30px;background-color:#fefefe;box-shadow:0 -6px 18px 0 rgba(9,32,76,.08)}
.sticky-adBottomAd-GiaBaoBlog .sticky-adBottomAd-GiaBaoBlogClose svg{fill:#767676}
.sticky-adBottomAd-GiaBaoBlog .sticky-adBottomAd-GiaBaoBlogContent{flex-grow:1;overflow:hidden;display:block;position:relative}
.sticky-adBottomAd-GiaBaoBlogInput:checked + .sticky-adBottomAd-GiaBaoBlog{padding:0;min-height:0}
.sticky-adBottomAd-GiaBaoBlogInput:checked + .sticky-adBottomAd-GiaBaoBlog .sticky-adBottomAd-GiaBaoBlogContent{display:none}  
  </style>  
 
<input class='sticky-adBottomAd-GiaBaoBlogInput hidden' id='sticky-adBottomAd-GiaBaoBlogIn' type='checkbox'/>
<div class='sticky-adBottomAd-GiaBaoBlog' id='sticky-adBottomAd-GiaBaoBlog'>
<label class='sticky-adBottomAd-GiaBaoBlogClose' for='sticky-adBottomAd-GiaBaoBlogIn'><svg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'><path d='M278.6 256l68.2-68.2c6.2-6.2 6.2-16.4 0-22.6-6.2-6.2-16.4-6.2-22.6 0L256 233.4l-68.2-68.2c-6.2-6.2-16.4-6.2-22.6 0-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3l68.2 68.2-68.2 68.2c-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3 6.2 6.2 16.4 6.2 22.6 0l68.2-68.2 68.2 68.2c6.2 6.2 16.4 6.2 22.6 0 6.2-6.2 6.2-16.4 0-22.6L278.6 256z'></path></svg></label>
<div class='sticky-adBottomAd-GiaBaoBlogContent'>
<!--<div class='ads-here' style='display:block;height:60px'/>-->
  <center> Ads </center>
<!--End Quảng cáo -->  
</div>
</div>

Mẫu Code Sticky Ads & Stick Div Ứng Dụng Tạo Thông Báo, Quảng Cáo với nút tắt ( Close ) đầu trang ( header & top ) :

<style>
/*sticky ad*/
.sticky-adHeader-GiaBaoBlog { position: fixed; top: 0; left: 0; width: 100%; min-height: 70px; max-height: 200px; padding: 5px 0; box-shadow: 0 -6px 18px 0 rgba(9,32,76,.1); -webkit-transition: all .1s ease-in; transition: all .1s ease-in; display: flex; align-items: center; justify-content: center; background-color: #fefefe; z-index: 20; }
.sticky-adHeader-GiaBaoBlog-close { width: 65px; height: 30px; display: flex; align-items: center; justify-content: center; border-radius: 12px 0 0; position: absolute; right: 0; top: 70px; background-color: #fefefe; box-shadow: 0 -6px 18px 0 rgba(9,32,76,.08); }
.sticky-adHeader-GiaBaoBlog .sticky-adHeader-GiaBaoBlog-close svg { width: 22px; height: 22px; fill: #000; }
.sticky-adHeader-GiaBaoBlog .sticky-adHeader-GiaBaoBlog-content { overflow: hidden; display: block; position: relative; height: 70px; width: 100%; margin-right: 10px; margin-left: 10px; } 
</style>

<div class='sticky-adHeader-GiaBaoBlog jhfdiuh0' id='sticky-adHeader-GiaBaoBlog'>
<div class='sticky-adHeader-GiaBaoBlog-close' onclick='document.getElementById(&quot;sticky-adHeader-GiaBaoBlog&quot;).style.display=&quot;none&quot;'>Tắt QC
<!--
<svg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'><path d='M278.6 256l68.2-68.2c6.2-6.2 6.2-16.4 0-22.6-6.2-6.2-16.4-6.2-22.6 0L256 233.4l-68.2-68.2c-6.2-6.2-16.4-6.2-22.6 0-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3l68.2 68.2-68.2 68.2c-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3 6.2 6.2 16.4 6.2 22.6 0l68.2-68.2 68.2 68.2c6.2 6.2 16.4 6.2 22.6 0 6.2-6.2 6.2-16.4 0-22.6L278.6 256z'/></svg>
-->
</div>
<div class='sticky-adHeader-GiaBaoBlog-content'>
<!--vị Trí : Chèn Nội Dung - code Quảng Cáo -->
<center> ADs  </center>
<!--Kết Thúc Chèn Nội Dung - code Quảng Cáo -->
</div>
</div>


Your Ads Here
Liên hệ quảng cáo : Freelancervietlach@Gmail.com
Tắt QC
Your Ads Here
Liên hệ quảng cáo : Freelancervietlach@Gmail.com
Digitalnomad.vn : Thiết Kế Web đa cấu trúc, trải nghiệm viết blog đa nội dung, Koc Content truyền thông cho chính mình, xây dựng hệ thống kiếm tiền tự động online, đa dạng nguồn tài chính từ việc kiến tạo các thu nhập thụ động trên internet. Gia Bảo, Blogger viết vì đam mê, chia sẻ kỹ thuật giúp bạn biến các thiết bị công nghệ kết nối internet, thành cỗ máy MMO khai thác mỏ vàng trực tuyến, các thức giúp chúng ta chạm tay vào 'tự do tài chính'.

Chủ Đề Nổi Bật :


Sponsor

1. thotgo.asia
2. goghepthanh.com
3. dichvuketoannasa.com
4. remcuakimanh.vn