본문 바로가기

아래로 스크롤 해주세요!

My Reference Book

-

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

HTML

HTML 태그 톺아보기

HTML

자세히보기

CSS

CSS 속성 톺아보기

CSS

자세히보기

JAVASCRIPT

JS 실행문 톺아보기

JAVASCRIPT

자세히보기

최신댓글

총 방문자

728x90

분류 전체보기174

#검색결과

총 174개를 찾았어요 ^^b

/

슬라이드 이펙트 07 슬라이더 이펙트_07 닷 메뉴를 클릭하면 해당 이미지로 이동하고 플레이/정지 클릭 여부에 따라 슬라이드를 멈춰주는 예제를 만들어보도록 하겠습니다~ 👩🏻‍💻 HTML 코드 HTML 코드는 크게 신경쓸것이 없으나, 슬라이드를 구현하기 위해 하단과 같이 코드를 작성해 뼈대를 생성해줍시다 🏄‍♂️ 이미지1 이미지2 이미지3 이미지4 이미지5 prev next CSS 코드 : 애니메이션 CSS를 통해 각각 dot과 active 클래스를 생성해 슬라이드 닷 까지 구성해줍니다. 👀 /* slider */ .slider__wrap { /* background: #000; */ width: 100%; height: 100vh; /* background-color: #ccc; */ display: flex; align-i..
2022. 10. 21.
패럴렉스 이펙트_07 : 각 문장에 딜레이를 걸어 효과주기 🐢 패럴렉스 이펙트_07 각 span태그가 감싸여있지 않은 문장들을 span태그로 감싸 각 이미지와 span태그에 after/before 요소를 통해 효과를 주도록 해보겠습니다 👩🏻‍💻 HTML 코드 HTML 코드는 크게 신경쓸것이 없으나, 각 desc에 data-delay를 추가시켜 각 애니메이션에 딜레이를 줄겁니다!🏄‍♂️ 01 section1 우리는 사랑하는 친구들에 의해서만 알려진다. 02 section2 사랑은 눈으로 보지 않고 마음으로 보는 거지. 03 section3 두 분은 상처 하나 입지 않고, 대용사가 된 셈이오. 04 section4 그의 믿음은 그가 쓰는 모자의 유행처럼 변한다. 05 section5 잘 있거라! 우리가 언제 다시 만날지는 아무도 모른다. 06 section6 죄를 짓고..
2022. 10. 7.
패럴렉스 이펙트_06 : 각 글자마다 효과주기 ✨ 패럴렉스 이펙트_06 각 문자들을 한글자씩 쪼개 태그로 감싸준뒤 그 텍스트에 각각 애니메이션을 주도록 하겠습니다 ₍ · з · ₎ HTML 코드 HTML 코드는 크게 신경쓸것이 없으나, 각 desc에 split 클래스가 달려있는것을 자바스크립트로 인식시켜 span으로 각각 한글자씩 쪼개줄거기 때문에 split 클래스명을 꼭 적도록 해야해요! 01 section1 우리는 사랑하는 친구들에 의해서만 알려진다. 02 section2 사랑은 눈으로 보지 않고 마음으로 보는 거지. 03 section3 두 분은 상처 하나 입지 않고, 대용사가 된 셈이오. 04 section4 그의 믿음은 그가 쓰는 모자의 유행처럼 변한다. 05 section5 잘 있거라! 우리가 언제 다시 만날지는 아무도 모른다. 06 sect..
2022. 10. 7.
오답노트_02 정리 👩🏻‍💻 오답노트 그저,,반성 🥲 1번 매개변수로 받아온 1996을 num에 넣어준뒤 num의 값을 10과 나눠 몫을 answer에 더해준뒤 num의 값을 num / 10을 해줘 나온 나머지를 num에 넣고 반복하는 문제입니다. 1. answer에는 0을 대입해줍니다. 2. num동안 while을 통해 반복하는데 3. answer에는 num(1996)을 10 나눠준 나머지를 더해줍니다. 4. num을 10이랑 나눠준 몫을 정수로 변환시켜준 후 num에 대입해줍니다. * 반복시 [1996/10=6],[199/10=9],[19/10=1],[1/10=1] 5. function q1(num) { let answer = 0; while(num) { answer += num % 10; num = parseInt(num / ..
2022. 10. 7.
728x90
반응형

#HASH_TAGS

-

1

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

티스토리툴바