아보카도홈페이지 배경 효과 지속시키는법

매출이 오르면 내리는 수수료! 지금 수수료센터에서 전자결제(PG)수수료 비교견적 신청해 보세요!
아보카도홈페이지 배경 효과 지속시키는법

QA

아보카도홈페이지 배경 효과 지속시키는법

본문

안녕하세요, 아보카도 홈페이지에  codepen (https://codepen.io/alphardex/pen/RwrVoeL)

해당 효과를 적용까지 무사히 시켰는데요!  문제는 효과자체가 모서리에 별이 모여있다가 떨어지는 구조이다보니 메뉴를 이동하면 새로고침이 되면서 처음부터 시작되어서 다시 모여있다가 떨어지는 문제가있는데 카테고리(메뉴)를 옮겨도 그대로 유지되게 하려면 이부분은 어떤 코드를 추가해야 하나요..?ㅠㅠ

 

아래는 제가 적용할때 참고한 글입니다..! 

✦ 링크 : https://codepen.io/alphardex/pen/dyPorwJ

✦ 첫번째 링크에 들어가 HTML에 적힌걸 head.php의 <!-- 헤더 영역 --> 위에다 붙여줍니다
참고로 그냥 넣으면 적용이 안되니 복붙한거 위아래에 <div class="snow_board"> (복붙한거) </div> 이렇게 넣어줬어요

✦ 그 다음 CSS에 적힌거! 이건 그냥 CSS가 아니라 SCSS라서 CSS로 변환
이때 맨 위에 있는 body 부분은 빼줍니다

body {
  height: 100vh;
  background: radial-gradient(ellipse at bottom, #1b2735 0%, #090a0f 100%);
  overflow: hidden;
  filter: drop-shadow(0 0 10px white);
}

이걸 빼고 복붙해주세요. 

✦ 변환된걸 복사해서 메모장이나... 노트패드나... 암튼 코드 수정하는 프로그램 열어서 붙여 넣어준 뒤에 맨 위에
.snow_board {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  filter: drop-shadow(0 0 10px white);
}
를 붙여넣고 아무 이름.css로 저장합니다. (안 붙여넣으면 스크롤이 긴 페이지에서 아래에는 눈이 안 내리고 끊겨 보입니다)
저장한걸 갠홈의 css 폴더에 넣어주세요. (저는 snow.css로 저장했음)

✦ head.sub.php를 열어서
<script src="<?php echo G5_JS_URL ?>/jquery.cookie.js"></script> 어쩌고~ 하는거 위에
<link rel="stylesheet" href="홈페이지 주소/css/아까 저장한 이름.css"> 를 붙여줍니다

참고로 /css/snow.css는 경로이므로 css파일을 다른 폴더에 저장했다면 그 경로로 수정해줘야 합니다.

이 질문에 댓글 쓰기 :

답변 1

a link 로 이동하면 새로고침 되어서 당연히 다시 시작할 것입니다.

ajax로 불러오면 새로고침이 되지 않기 때문에 계속이어서 나올 것입니다.
카테고리를 ajax로 불러오는것은 어렵지 않을 것입니다만 게시물 링크를 클릭하면 링크가 변경되겠네요...
그래서 효과가 처음부터 다시 시작될 것입니다.

답변을 작성하시기 전에 로그인 해주세요.
전체 0
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT