jineecode

1. ctrl + ` = 터미널 열어주기 2. git init 입력하기 (git 폴더를 만들어줌_ 숨김파일) 3. git config --global user.name "내 이름" git config --global user.email "내 메일주소" 4. git status 로 상태 확인하기 5. git add 명령어들 ifuwanna.tistory.com/193 Git 저장소 생성 및 커밋 ( init / add / commit ) 개요 깃 (Git) 의 장점중 하나는 대부분의 명령을 로컬에서 실행한다는 점입니다. 원격 저장소(remote Repository) 의 정보가 필요한때만 (pull push 등) 네트워크가 필요하고 그 외에는 오프라인 환경 ifuwanna.tistory.com 6. git ..

UPLOAD를 누르면 .uploadName에 이미지 이름이, .img1에 이미지가 들어가게 해보자. HTML UPLOAD "UPLOAD" label과 그 label에 연결된 input(#mainImage)이 있음. JS $(function(){ const fileTarget = $(".uploadHidden"); $("#mainImage").on("change", img1FileSelect); fileTarget.on('change', function(){ if(window.FileReader){ let filename = $(this)[0].files[0].name; $(this).siblings('.uploadName').val(filename); console.log(filename); } }); ..

1. animate event 디비전 안에 문단 animate 문법 $(selector).animate({params}),speed,callback); mouseenter 와 mouseleave를 쓴 animate 메서드 $(function(){ $('div').on("mouseenter",function(){ $('div').animate({"width": 300, "height":300}, 500); }); $('div').on("mouseleave",function(){ $('div').stop().animate({"width": 100, "height":100}, 500); }); }); *animate에 stop()을 넣어주지 않으면 마우스오버한 횟수를 모두 채웁니다. $('div').on("m..

0. 들어가기 전에... function(){} 바깥에다 this를 찍어보면 어떻게 나올까? this 는 윈도우를 가리킨다. console.log(this); $(function(){ }); function(){} 안에다 this를 찍어보면 어떻게 나올까? this는 $(function(){}) = document.ready, 즉 document를 가리킨다. $(function(){ console.log(this); }); 00 00 1. click event $(function(){ $(".box1").on("click", function(){ $("p").text("클릭했습니다!") }); }); $(function(){ $('.box1').click(function(){ $("p").text("클릭..

attr method click1 click2 $(function(){ let attr = $("div").attr("class"); // "green" }); 2. 파라미터가 2개이면, 1번 파라미터 속성을 2번 파라미터 값으로 변경합니다. $(function(){ let attr = $("div").attr("class","red"); }); html의 "div class" 가 "red"로 바뀐다 문법 $(selector).attr(attribute, value); 과제: click1 버튼을 클릭하면 green div 박스가 click2 버튼을 클릭하면 red div 박스가 나오게 해보자 더보기 $(function){ $(".btn1").click(function(){ $("div") .attr("c..

Build 30 things in 30 days with 30 tutorials No Frameworks×No Compilers×No Libraries×No Boilerplate javascript30.com/ JavaScript 30 Build 30 things with vanilla JS in 30 days with 30 tutorials javascript30.com

$(window).scroll(function(){ let scroll = $(window).scrollTop(); // offSet().top이 4개 필요하므로 반복문 사용 for(let i = 0; i < $("article").length; i++) { // console.log(i+"안녕 "); // article 각각의 높이를 읽어준다. let articleTop = $("article").eq(i).offset().top; // console.log(articleTop) // articleTop + article의 높이 = articlebottom let articleBottom = articleTop + $("article").eq(i).outerHeight(); let winHeight =..

.offset() : fixed 같은 효과. 선택한 요소 집합의 첫 번째 요소의 위치를 HTML 문서를 기준으로 반환하거나, 선택한 요소의 위치를 인수로 전달받은 값으로 설정한다. .position() : absolute 같은 효과. 선택한 요소 집합의 첫 번째 요소의 위치를 해당 요소가 웹 페이지에 위치할 때 기준이 되었던 부모 요소를 기준으로 하는 상대 위치를 반환한다. What I am good at (".gnb li") 을 누르면 스크롤 이동하게 해보자 $(".gnb li").eq(1).click(function(){ var offTop = $(".goodAt").offset().top; $("html,body").animate({scrollTop:offTop}); }); $(".gnb li")...