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
✨ Bài viết được thực hiện bởi Blogger Gia Bảo, Freelancer Marketing Online, có nhiệm vụ kết nối khách cần mua với nhà phân phối, công ty sản xuất. BLOG GIA BẢO không phải đơn vị trực tiếp bán hàng trên website mà chỉ là nơi giúp bên mua gặp gỡ bên bán.

✨ Nổi bật : Mô hình Freelancer Marketing Online Cùng Nhà Phân Phối / Công Ty Sản Xuất Triển Khai Kênh Bán Hàng Trực Tuyến Thông Qua Việc Mở Gian Hàng TMĐT : Xem thêm,....

Kem chống nắng Biore UV Aqua Rich Watery Essence/Gel SPF 50+/ PA++++ 50ml/90ml

Xem Giá Bán
Xem thêm : Chăm Sóc Cơ Thể
Mua ngay

Bộ bàn ăn gỗ cao su gấp gọn

Xem Giá Bán
Tìm hiểu thêm về : Gỗ ghép
Đặt Mua ngay