발란

BYEOLYI SHIN·2023년 6월 27일
0

Portfolio

목록 보기
3/6

발란 코딩

-사이트명 : 발란
-사용언어 : html , css
-분류 : 적응형pc,

🔋 Main Point

  • 슬라이드 끝나면 버튼숨기기
  • 슬라이드 넘어가며 겹치는 효과주기
  • root에 자주 쓸 컬러 상속해주기
  • 슬라이드 끝나면 버튼숨기기
  • 폰트어썸으로 화살표넣기

1. 슬라이드 끝나면 버튼숨기기


버튼 내 disabled 클래스명을 긁어와 끝 지점으로 갔을때 위치를 마이너스 시켜 화면밖으로 사라지는 효과를 줄수있다
(부드럽게 넘길때는 .btn 클래스에 transition:0.3s 적용)

2. 슬라이드 넘어가며 겹치는 효과주기

= 정답은~~~
https://swiperjs.com/demos#parallax

💡 Parallax (사이트 참조)
1.명령어를 복붙해서 해당 이미지 박스에 추가하면된다


2. JS에는 parallax:true 넣어줄것

  1. 넘치는 영역 잘라주기 overflow:hidden

3. root에 자주 쓸 컬러 상속해주기

발란 사이트에서 포인트로 사용되는 컬러명이 복잡하여 root에 입력해주고 필요할때마다 꺼내먹는다..(이 노래를 초콜릿처럼 꺼내 먹어요,,)

4. 슬라이드 끝나면 버튼 숨기기

5.폰트어썸으로 화살표 넣기

https://cdnjs.com/libraries/font-awesome
복사해서 인덱스 맨 위에 넣어주고

폰트어썸 사이트에서 필요한 화살표 복붙하면 끝 !

profile
안녕하세요

0개의 댓글

관련 채용 정보