플로팅 버튼

로컬홀릭
2022-09-04
조회수 161



<!-- 플로팅 배너 CSS -->

<style>


/* PC 배너1 스타일 */

.floBanPc1 {

  position: fixed;

  bottom: 193px; /* 윗쪽 끝에서부터의 거리 */

  right: 30px;

  z-index: 99;

}

/* PC 배너2 스타일 */

.floBanPc2 {

  position: fixed;

  bottom: 137px; /* 윗쪽 끝에서부터의 거리 */

  right: 30px;

  z-index: 99;

}

/* PC 배너3 스타일 */

.floBanPc3 {

  position: fixed;

  bottom: 82px; /* 윗쪽 끝에서부터의 거리 */

  right: 30px;

  z-index: 99;

}

/* 모바일 배너1 스타일 */

.floBanMob1 {

  position: fixed;

  bottom: 158px; /* 아래 끝에서부터의 거리 */

  right: -250px; /* 오른쪽 끝에서부터의 거리 */

  z-index: 99;

}

/* 모바일 배너2 스타일 */

.floBanMob2 {

  position: fixed;

  bottom: 108px; /* 아래 끝에서부터의 거리 */

  right: -250px; /* 오른쪽 끝에서부터의 거리 */

  z-index: 99;

}

/* 모바일 배너3 스타일 */

.floBanMob3 {

  position: fixed;

  bottom: 58px; /* 아래 끝에서부터의 거리 */

  right: -250px; /* 오른쪽 끝에서부터의 거리 */

  z-index: 99;

}

</style>


<!-- 플로팅 배너 HTML -->

<!-- PC 배너1 -->

<div class="floBanPc1 hidden-md hidden-sm hidden-xs">

  <a href="https://instagram.com/localholic.life/" target="_blank">

    <img src="https://cdn.imweb.me/upload/S20220614d4159dd4b1eef/51ce22d58c564.png" width="50px" height="50px">

  </a>

</div>

<!-- PC 배너2 -->

<div class="floBanPc2 hidden-md hidden-sm hidden-xs">

  <a href="https://facebook.com/Localholic.life" target="_blank">

    <img src="https://cdn.imweb.me/upload/S20220614d4159dd4b1eef/de49ea64bc5c3.png" width="50px" height="50px">

  </a>

</div>

<!-- PC 배너3 -->

<div class="floBanPc3 hidden-md hidden-sm hidden-xs">

  <a href="#doz_header">

    <img src="https://cdn.imweb.me/upload/S20220614d4159dd4b1eef/94c823af5c3db.png" width="50px" height="50px">

  </a>

</div>

<!-- 모바일 배너1 -->

<div class="floBanMob1 hidden-lg">

  <a href="https://instagram.com/localholic.life/" target="_blank">

    <img src="https://cdn.imweb.me/upload/S20220614d4159dd4b1eef/51ce22d58c564.png" width="15%">

  </a>

</div>

<!-- 모바일 배너2 -->

<div class="floBanMob2 hidden-lg">

  <a href="https://facebook.com/Localholic.life" target="_blank">

    <img src="https://cdn.imweb.me/upload/S20220614d4159dd4b1eef/de49ea64bc5c3.png" width="15%">

  </a>

</div>

<!-- 모바일 배너3 -->

<div class="floBanMob3 hidden-lg">

  <a href="#doz_header">

    <img src="https://cdn.imweb.me/upload/S20220614d4159dd4b1eef/94c823af5c3db.png" width="15%">

  </a>

</div>


0 0

고객센터 070-4455-4667 

(월-금, 10:00-16:00    토, 일, 공휴일 휴무)

전화 전 채널톡에 문의남겨주시면 자세히 상담드리겠습니다.

회사: 로컬콘텐츠랩 | 대표: 차주용 | 통신판매업: 2022-서울중구-0148

서울 중구 청계천로 40 한국관광공사 서울센터 8층 814호

사업자등록번호: 188-24-01135

상품입점 및 인터뷰 문의 : localholic.life@gmail.com

ⓒ LOCAL CONTENTS LAB. ALL RIGHTS RESERVED

고객센터 070-4455-4667 (월-금, 10:00-16:00    토, 일, 공휴일 휴무)

전화 전 채널톡에 문의남겨주시면 자세히 상담드리겠습니다. 

회사: 로컬콘텐츠랩 | 대표: 차주용 | 사업자등록번호: 188-24-01135 | 통신판매업: 2022-서울중구-0148 | 관광사업자 등록번호: 제 2022-000032호

주소: 서울 중구 청계천로 40 한국관광공사 서울센터 8층 814호 | 상품입점 및 인터뷰 문의 : localholic.life@gmail.com

ⓒ LOCAL CONTENTS LAB. ALL RIGHTS RESERVED