SHARE CODE LIÊN HỆ NHANH CỰC ĐẸP CHO BLOG [QUICK CONTACT]

Tác giả: Hoàng Thành

Xuất bản:

TẢN MẠN

Hello, xin chào tất cả các bạn đã quay trở lại với blog của mình !!! Ngồi học chán quá nên lang thang trên mấy blog chơi thấy bên Tuổi Trẻ IT có cái code này hay hay nên mạn phép lấy về share. Biết là điều sai trái và ko nên nhưng mà nó đẹp quá ko cưỡng được !!!(cơ mà code này ko có khó để tìm trên mạng)

DEMO VÀ THÔNG TIN CODE

Code Name : Quick Contact
Responsive : Có
Develop by: Tuổi Trẻ IT
Riped by : Nguyễn Dương Hoàng Thành

LIÊN HỆ CLICK NOW XEM TRƯỚC CLICK NOW

THỰC HÀNH

Các bạn Copy & Edit đoạn code bên dưới, sau đó đặt nó vào trước thẻ đóng </body>

<!-- Bắt đầu liên hệ nhanh -->
<style>
.support-online { position: fixed; z-index: 999; left: 0; bottom:0px;}.support-online a { position: relative; margin: 20px 10px; text-align: left; width: 40px; height: 40px;}.support-online i {
    text-align: center;
    width: 39px;
    height: 39px;
    background: #72bf3b;
    color: #fff;
    border-radius: 100%;
    font-size: 20px;
    line-height: 1.9;
    position: relative;
    z-index: 999;
    margin-left: -2px;
    margin-top: 3px;
}.support-online a span { border-radius: 2px; text-align: center; background: rgb(103, 182, 52); padding: 9px; display: none; width: 180px; margin-left: 10px; position: absolute; color: #ffffff; z-index: 999; top: 0px; left: 40px; transition: all 0.2s ease-in-out 0s; -moz-animation: headerAnimation 0.7s 1; -webkit-animation: headerAnimation 0.7s 1; -o-animation: headerAnimation 0.7s 1; animation: headerAnimation 0.7s 1;}.support-online a:hover span { display: block;}.support-online a { display: block;}.support-online a span:before { content: ""; width: 0; height: 0; border-style: solid; border-width: 10px 10px 10px 0; border-color: transparent rgb(103, 182, 52) transparent transparent; position: absolute; left: -10px; top: 10px;}.kenit-alo-circle-fill { width: 60px; height: 60px; top: -10px; position: absolute; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; border: 2px solid transparent; -webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; transition: all .5s; background-color: rgba(0, 175, 242, 0.5); opacity: .75; right: -10px;}.kenit-alo-circle { width: 50px; height: 50px; top: -5px; right: -5px; position: absolute; background-color: transparent; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; border: 2px solid rgba(30, 30, 30, 0.4); opacity: .1; border-color: #0089B9; opacity: .5;}.support-online .btn-support { cursor: pointer;}.btn-support .tooltiptext { visibility: hidden; width: 140px; background-color: black; color: #fff; text-align: center; border-radius: 3px; padding: 4px 2px; position: absolute; z-index: 1;}.btn-support:hover .tooltiptext { visibility: visibl
</style>
<script>
jQuery(document).ready(function(){
    jQuery('.support-content').hide();
    jQuery('a.btn-support').click(function(e){
      e.stopPropagation();
      jQuery('.support-content').slideToggle();
    });
    jQuery('.support-content').click(function(e){
      e.stopPropagation();
    });
    jQuery(document).click(function(){
      jQuery('.support-content').slideUp();
    });
});
</script>
<div class='support-online'>
<div class='support-content' style='display: block;padding-left: 34px;'>
<a class='call-now' href='tel:01686897757' rel='nofollow'>
<i aria-hidden='true' class='fa fa-whatsapp'/>
<div class='animated infinite zoomIn kenit-alo-circle'/>
<div class='animated infinite pulse kenit-alo-circle-fill'/>
<span>Hotline: 0168.689.7757</span>
</a>
<a class='mes' href='https://www.messenger.com/t/www.leanhduc.xyz' target='_blank'>
<i aria-hidden='true' class='fa fa-facebook-official'/>
<span>Nhắn Tin Facebook</span>
</a>
<a class='zalo' href='https://zalo.me/01686897757' target='_blank'>
<i class='fa fa-comments'/>
  <span>Zalo: 0168.689.7757</span>
</a>
</div>
<a class='btn-support' style='     padding-left: 33px; '>
<div class='animated infinite zoomIn kenit-alo-circle'/>
<div class='animated infinite pulse kenit-alo-circle-fill'/>
<i aria-hidden='true' class='fa fa-user-circle'/>
<div class='tooltip'>
</div>
</a></div>
<!-- Kết thúc liên hệ nhanh -->