# animate()
3일차 미니 팀프로젝트 css 보충(애니메이션 효과, 수직정렬, 스크롤)
<span style="background-color:- <팀프로젝트> css 보강하기2년 전 썼던 낡은 코드라 지금도 쓰는지는 모르겠지만..저렇게 텍스트들이 이미지 위로 올라가 정렬이 안맞는 모습이였다..그래서 검색해보니 요런게 있었다.vertical-al
jquery 슬라이드 ,animate 관련 (중요할듯)
fade in,out 이거 야무짐slide 관련 (slow,fast,시간(1/1000)카테고리 슬라이드 관련 참고코드이미지 슬라이드 관련 참고코드animate 관련
Front-end 국비지원 #060일
JQuery Progress Bar 01 >결과 >HTML >CSS >script >변수는 감싸고 있는 .progress-bar 와 안에 .bar , .num 이 있고 .num의 안에 data-num이 있는데 progressData 로 만들었다. progressBar 의 애니메이션은 progressData 의 width + '%' 의 값으로 만...
Front-end 국비지원 #054일
결과휠을 내리게 되면 다음 SectionHTMLCSSscript에 설명된 주석을 참고결과HTMLCSSscrollLeft 값만 바꿔주면 동작이 된다. 결과HTMLCSSscriptTyping 효과를 나타나게 하는 효과이다.CDN은 구글링을 통해 가져온다. 정해진 공식 페이
Front-end 국비지원 #052일
결과hover를 하게되면 투명도가 있는 배경이 이미지에 십자가모양으로 이펙트를 주게된다.HTMLCSSClass Top , Bottom 의 그림설명top은 넓이가 100%를 차지한다 높이는 50% 영역을 차지하고 하단에 위치한다. (위치가 헷갈릴듯.. 양해바람)botto
Front-end 국비지원 #042일
결과HTMLSCSS모바일 720px 사이즈로 메뉴바를 먼저 제작하였다. left 100%를 벗어난 영역에서 나타나는 효과를 만들기 위해 position: fixed; , display: none; , left: -100% 를 적용한다. left: -100% 로 나간 모
Front-end 국비지원 #040일
HTMLCSS결과HTMLCSSScriptCSS에 javascript로 적용하기 위해 .shrink라는 클래스를 classList를 사용하기 위해 넣어 두었다.스크롤이 내려가면 로고가 바뀌어야 하므로 변수를 지정하고 변할 img 파일 경로를 넣어둔다.조건문을 만들어 sc
Front-end 국비지원 #035일
반응형 페이지 제작 1-1 > 이번 시간에는 제플린을 사용하여 반응형 페이지를 제작한다. 제플린이란? > ### 제플린을 쓰는 이유 이미지 슬라이스 사용이 편리하다. 텍스트 선택시 폰트 정보가 다 나온다. CSS로 나오는데 필요한 부분만 셀렉해서 사용하는 것을
Jquery 클릭 시, 해당 태그로 이동..
offset.top - 172 : 위의 네비게이션바의 크기(172px) 만큼 위치를 조정하였음..navEl_01 : 클릭 할 버튼의 className.section03_02 이동할 div의 classNameanimate : 애니메이션offset : 위치scrollTop
220822 JavaScript
scroll 스크롤바의 위치가 이동되는 이벤트(마우스휠이나 스크롤바의 스크롤을 누름에 따라) scrollTop() 스크롤바의 스크롤탑에서 부터의 위치, 스크롤바 위치 조정 scrollTop(수치) 두번째 상자의 위치에 걸치게 됨. offset().top() 요소가
UILabel LineSpacing - AttributedString, Animate, BackButton
Today 7/30StartScreen부분 디테일 보완을 진행했다.iOS ) NavigationController BackButton 색상, 텍스트 바꾸기\[ios] Swift에서 UILabel의 줄 간격을 늘리는 방법attributeString에 addAttribut
[6/23 일반] 라이브러리 소개
1) 필기 내용6/23 일반 라이브러리 소개jQuery 효과 : 선택자로 선택된 태그를 사라지게 하거나 나타나게 할 수 있고, 여러 가지 효과를 제공함hide, show, toggle(hide와 show의 합체버전)fadeIn, fadeOut, fadeToggle(fa
[jQuery] animation vs animate의 차이점?
🗒 비슷해보이지만 확실히 다른 animation과 animate의 차이점을 정리해보겠습니다!간단하게,animation은 숨기거나 표시하기, 아래로 펼쳐짐 등등의 효과로 태그를 동작시키는 것이고,animate는 css스타일을 통해 태그를 동작시키는 것입니다.| 중요 명
Animation: frame vs layout constraints
첫 번째 포스팅은 애니메이션에 관한 것입니다. 기초에 충실하게 정리해봤습니다.
[jQuery] GNB 메뉴 활성화, 스크롤 이동
로드 된 스크롤 위치에서 메뉴 활성화 > body의 경우 scroll 값을 반환하지 못하므로 $(window).scrollTop(); 를 쓴다. GNB 메뉴 클릭 시 해당 섹션으로 이동 > animation queue jQuery에서 animate()함수로 애니메
Swipe에 따라 움직이는 상단바 구현
Swipe에 맞춰서 움직이는 애니메이션을 구현해보고 싶어서 다양한 도전끝에 길을 찾았습니다. 공유해볼게요!
