본문 바로가기

아래로 스크롤 해주세요!

My Reference Book

-

제가 배웠던것을 한곳에 정리해보았어요!

HTML

HTML 태그 톺아보기

HTML

자세히보기

CSS

CSS 속성 톺아보기

CSS

자세히보기

JAVASCRIPT

JS 실행문 톺아보기

JAVASCRIPT

자세히보기

최신댓글

총 방문자

728x90

scroll-snap-align1

#검색결과

총 1개를 찾았어요 ^^b

/

스크롤할때 다음 이미지에 자동으로 딱 멈춰주는 효과를 구현해보자! : scroll-snap-type 사용 스크롤시 다음 요소에 딱! 멈춰주는 듯한 효과를 CSS로 줘보자! 저번에 올렸던 prefers-color-scheme 을 통해 간단하게 다크모드를 구현했던것처럼 이번에도 간단한 방법이 있길래 올려봤어요! 홈페이지를 둘러보면 스크롤을 할때 무언가 탁탁 걸린듯한 원하는 item에 스크롤이 멈추는 효과가 적용되어있는 홈페이지가 있지 않나요? 이번에는 그 효과를 CSS를 통해서 간단한 문구 추가로 구현이 가능하기에 적어보았습니다 ^----^ HTML 코드 : 간단한 예제용 저는 간단한 예제를 본문에 첨부하기위해 하단과 같이 사용했어요! 클래스는 좀 더 직관적이게 [ slider_view / slider_move / item ] 라고 편하게 적었습니다~ * 사실 이래야 제가 보기 편했어요.... CSS 코드 : ..
2022. 9. 18.
728x90
반응형

#HASH_TAGS

-

1

이건 또 뭐람 슬라이드 결과 : 월요일 코드 오늘도 웹표준은.. HTML JQuery 내일은 즐거운 월요일 선택해주세요 오징어 두마리 포획 완료 코딩 Method 공부 오늘 조업 마감했습니다. 메서드 ImageSlideEffect 테스트테스트 테스트 오늘은 내가바로 오징어! 오징어 한마리 수확 완료! 멈추지 않는 ' j ' 시리-즈 다크모드 필터선택자 scroll-snap-type 오징어 1Kg 당 3000원 scroll-snap-align 화사한가요? 제이쿼리 울적하니 꽃을 달아봤습니다 숙제가 다양해서 너무 좋아요

티스토리툴바