Bible, Lee, Data
Faith, software, data, and everyday life.
CategoriesAll posts
[jQuery] Traversing (Axis)
🍁Traversing기본 코드 Axis 할아버지 큰아버지 사촌 아버지 큰형 작은형 나 자식 손자 자식 자식 동생 막내동생 작은아버지 사촌 [JavaScript] Axis: 축을 기준으로 검색🍁Axis ..
[jQuery] CSS 속성 조작: Box Model, Manipulation
🍁CSS 적용CSS 읽기 쓰기읽기: CSS(속성)쓰기: CSS(속성, 값) CSS 읽기//alert(getComputedStyle(document.getElementById('box')).getPropertyValue('color'));alert($('#box').css('color'));jQuery에는 내부적으로 이 작업이 되어 있다는 것을 알 수 있다. CSS 쓰기 (메서드 체인)//$('#box').css('color', 'blue');$('#box').css('color', 'blue').css('background-color', 'gold').css('font-size', '3rem');jQuery는 연쇄적으로 작업할 수 있다는 점에서 편리하다.css(속성명, 값)이 반복하여 쓰이고 있다. 이..
[JavaScript] Requirements Q37~42: Transition 1
📌Requirements Q37: 스크롤 이벤트 Index Lorem ipsum dolor sit amet consectetur adipisicing elit. Est, commodi, natus ex, iste fugiat provident doloremque mollitia numquam nulla perferendis ab. Repudiandae ullam veniam sit dolor quibusdam nemo excepturi impedit. About me Lorem ipsum dolor sit amet consectetur adipisicing elit. Et eius possimus recusandae repellat labore in officia eligendi quas sit non ..
[JavaScript] Scroll Event
🍁Scroll Event 기본 코드 Title Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptates quia veniam quisquam voluptatibus facilis iste ad sequi? Ducimus, optio fugiat. Tempora non fugiat nobis soluta a quia, aliquam mollitia eos. Soluta maiores quisquam molestias nemo eos at neque impedit, perspiciatis dolorem, enim iusto obcaecati sit suscipit minus, non dolores doloremque! Esse a adipisc..
[Git] GitHub Pages: Portfolio Hosting
🍁Portfolio Hosting템플릿 다운로드https://bootstrapmade.com/demo/Append/ Append Bootstrap Template Demo bootstrapmade.com https://html5up.net/ HTML5 UPResponsive HTML5 and CSS3 site templates designed by @ajlkn and released under the Creative Commons license.html5up.net내가 원하는 포트폴리오를 만든다.또는 템플릿을 사용하여 포트폴리오를 구성한다. 포트폴리오 폴더 생성포트폴리오 폴더를 생성한다. 깃허브 리포지토리 생성깃허브에서 포트폴리오 리포지토리를 생성한다. 깃허브 clone$ git clone https:..
[jQuery] Effect Function: 전용 / 범용 이벤트 함수
🍁전용 함수와 범용 함수전용 이벤트 함수객체.이벤트함수(콜백함수)$('#btn1').click(function() { alert();});위 코드는 클릭 이벤트만을 처리하는 함수이다.이렇게 하나의 이벤트만을 처리하는 함수를 전용 이벤트 함수라고 한다. 범용 이벤트 함수객체.on(이벤트명, 콜백함수)$('#btn2').on('click', function() { alert();})on은 범용 함수로, 이벤트명을 입력해야 한다.이벤트명에 따라서 다양한 이벤트를 처리하는 함수를 범용 이벤트 함수라고 한다.반대로 객체의 이벤트를 해제할 때에는 off 함수를 사용한다. 🍁Effect Function1. hide(time), show(time), toggle(time)2. fadeOut(time), ..
[jQuery] jQuery() 함수
🍁jQuery() 함수jQuery() 함수는 CSS 선택자 또는 다른 표현을 사용해서 태그를 검색한다. 기본 코드 jQuery() 함수 상자1 상자2 상자3 상자4 상자5 Array.from()//forEach > new Array()에서 동작//list.forEach(box => box.style.color = 'yellow'); //HTMLCollection (유사 배열)Array.from(list).forEach(box => box.style.color = 'tomato');자바스크립트는 구조상 진짜 배열이 없다고 했다. 하지만 new Array()로 만들어진 것을 진짜 배열로 취급한다.위에서 선언한 list는 배열이 아닌 HTMLCol..
[jQuery] jQuery의 시작: JavaScript와 jQuery 연결
🍁 jQueryjQuery란?jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. With a combination of versatility and extensibility, jQuery has changed the way that millions of people write JavaScript.jQuery는 경량화된 JavaSc..