본문 바로가기
728x90
300x250
SMALL

javaScript530

자바스크립트 기초 :: 변수 변수는 데이터를 담는 그릇같은 개념이다.변수 선언 var 변수1 이런식으로 var과 변수이름을 붙여준다. var 변수1 = 변수2;이렇게 하면 변수1안에 변수2 값이 들어간다. 변수에 들어있는 값을 다른 값으로 변경 하려면 var을 붙이지 않은 상태에서 값을 대입해 주면된다. 변수값이 들어갔는지 확인해보자 12345678910 function welcome(Name) { alert("Name = " + Name); } var hi = "mooyou"; welcome(hi); cs hi라는 변수를 선언하고 변수 안에 mooyou글자를 넣어준다.welcome라는 펑션을 실행하는데 hi변수를 인자로 넘긴다.그리고 얼럿창 Name = 변수 hi내용 실행 document.write(데이터,[데이터...]); //.. 2018. 12. 14.
썸네일 클릭하면 풀스크린 모핑 팝업창 morphing modal 버튼을 클릭하면 풀스크린 모핑 팝업창이 뜨는 스크립트 데모https://codyhouse.co/demo/morphing-modal-window/index.html#0다운https://github.com/CodyHouse/morphing-modal-window 호환성 ie9+ Chrome+ Firefox+ Sapari+ Opera+참고 transition transform Velocity.js github에서 다운 받은 파일들을 각 위치에 맞게 넣어준다. 123456789101112131415161718192021222324252627282930313233 Lorem ipsum dolor sit amet, close Fire Modal Window Colored by Color Scriptercs 그리고 .. 2018. 12. 12.
스크롤하면 해당 메뉴에 클래스 붙여서 효과주기 스크롤 했을때 해당 페이지에 위치해 있음을 확인 할 수 있도록 고정된 메뉴에 클래스를 붙여서 효과를 줄 수 있다. 예를 들면 이런식으로 클릭한 페이지를 클릭하거나 스크롤 되었을때 해당 메뉴에 클래스를 붙여줘서 스타일을 다르게 적용시켜준다. 123456789 HOME PORTFOLIO SKILLS ABOUT CONTACT Colored by Color Scriptercs 메뉴를 이렇게 넣었다면 12345678910111213141516171819202122232425 $(window).on('scroll', function () { var pos = $(window).scrollTop(); var pos2 = pos + 50; var scrollBottom = pos + $(window).height();.. 2018. 12. 7.
부드러운 페이지 스크롤 적용하기 smooth scroll :: 제이쿼리 부드럽게 내려가는 스크롤 스크립트 구하는 것은 어렵지 않다. 검색창에 smooth scroll이라고만 쳐도 많은 정보를 얻을 수 있다. https://idiotwu.github.io/smooth-scrollbar/ https://github.com/kswedberg/jquery-smooth-scroll 나는 그 중에서 github에서 다운 받은 부드러운 스크롤을 적용해봤다.위 주소에서 받을 수 있다. 압축된 파일을 풀어보면 demo폴더가 있다.거기서 index를 열어보면 위와 같은 화면이 p1버튼을 눌러 부드럽게 내려가는 것을 확인 할 수 있다.그래서 이 파일과 연결된 파일 12345678910111213141516 $(document).ready(function() { $('body').smoothSc.. 2018. 12. 6.
728x90
반응형
LIST