odada

https://github.com/eehd80/scrollup GitHub - eehd80/scrollup Contribute to eehd80/scrollup development by creating an account on GitHub. github.com ScrollUp은 모든 웹 사이트에서 쉽게 작동하는 사용자 정의 가능한 "Scroll to top"기능을 만드는 경량 jQuery 플러그인입니다. 사용하는 방법 jquery.scrollUp.min.js 파일을 포함하고 문서 헤드에 다음을 배치하기 만하면됩니다 (jQuery가 포함되어 있는지 확인). 기본 옵션 $(function () { $.scrollUp({ scrollName: 'scrollUp', // Element ID topDistanc..

jQuery DOM 조작 jQuery의 매우 중요한 부분 중 하나는 DOM을 조작 할 수 있다는 것입니다. DOM = 문서 개체 모델 DOM은 HTML 및 XML 문서에 액세스하기위한 표준을 정의합니다. "W3C DOM (문서 개체 모델)은 프로그램과 스크립트가 콘텐츠, 구조 및 콘텐츠에 동적으로 액세스하고 업데이트 할 수 있도록하는 플랫폼 및 언어 중립적 인터페이스입니다. 문서 스타일. " 콘텐츠 가져오기 요소의 콘텐츠를 가져오거나 설정할 수 있습니다. text() 선택한 요소의 텍스트 내용을 설정하거나 반환합니다. html() 선택한 요소 (HTML 마크 업 포함)의 내용을 설정하거나 반환합니다. val() 양식 필드의 값을 설정하거나 반환합니다. text(), html() See the Pen MW..

html의 요소를 선택하고 조작하려면 jQuery의 선택자를 사용해야 합니다. jQuery의 모든 선택기는 달러 기호와 괄호 ($ ())로 시작합니다. 태그 선택자 $("p") $("button").click(function(){ $("p").hide(); }); #id 선택자 $("#test") $("button").click(function(){ $("#test").hide(); }); .class 선택자 $(".test") $("button").click(function(){ $(".test").hide(); }); 추가 선택자 $("*") 모든 요소 선택 $(this) 현재 요소 선택 $("p.intro") 선택 $("p:first") 첫번째 요소 선택 $("ul > li") 의 자식 중 요소 선..

jQuery란? jQuery의 목적은 웹 사이트에서 JavaScript를 훨씬 쉽게 사용할 수 있도록하는 것입니다. 여러 줄의 자바스크립트로 처리해야 할 작업을 한줄로 처리할 수 있도록 합니다. 예를 들어 폰트 사이즈를 35px로 변경하는 스크립트를 작성하려고 한다면... jQuery를 이용하면 훨씬 쉽게 작성할 수 있습니다. javascript document.getElementById("demo").style.fontSize = "35px"; jQuery $("#demo").css("font-size", "35px"); 웹페이지에 jQuery 추가 jQuery를 사용하려면 jQuery 라이브러리가 필요합니다. 아래의 2가지 방법으로 연결하여 사용할 수 있습니다. 1. jQuery 다운로드 아래 사이트..

[펌] 벨로퍼트와 함께하는 모던 자바스크립트 https://learnjs.vlpt.us/basics/06-object.html 06. 객체 · GitBook 06. 객체 객체는 우리가 변수 혹은 상수를 사용하게 될 때 하나의 이름에 여러 종류의 값을 넣을 수 있게 해줍니다. const dog = { name: '멍멍이', age: 2 }; console.log(dog.name); console.log(dog.age); 결과물은 다 learnjs.vlpt.us 객체는 우리가 변수 혹은 상수를 사용하게 될 때 하나의 이름에 여러 종류의 값을 넣을 수 있게 해줍니다. const dog = { name: '멍멍이', age: 2 }; console.log(dog.name); console.log(dog.age)..

[펌] 벨로퍼트와 함께하는 모던 자바스크립트 https://learnjs.vlpt.us/basics/05-function.html 05. 함수 · GitBook 함수는, 특정 코드를 하나의 명령으로 실행 할 수 있게 해주는 기능입니다. 예를 들어서, 우리가 특정 값들의 합을 구하고 싶을 때는 다음과 같이 코드를 작성합니다. 한번, 이 작업을 함수로 만� learnjs.vlpt.us 함수는, 특정 코드를 하나의 명령으로 실행 할 수 있게 해주는 기능입니다. 예를 들어서, 우리가 특정 값들의 합을 구하고 싶을 때는 다음과 같이 코드를 작성합니다. const a = 1; const b = 2; const sum = a + b; 한번, 이 작업을 함수로 만들어보겠습니다. function add(a, b) { r..

[펌] 벨로퍼트와 함께하는 모던 자바스크립트 https://learnjs.vlpt.us/basics/04-conditions.html 04. 조건문 · GitBook 04. 조건문 조건문을 사용하면 특정 조건이 만족됐을 때 특정 코드를 실행할 수 있습니다. if 문 가장 기본적인 조건문은 if 문입니다. if문은, "~~하다면 ~~를 해라" 를 의미합니다. 예시 코드를 한�� learnjs.vlpt.us 조건문을 사용하면 특정 조건이 만족됐을 때 특정 코드를 실행할 수 있습니다. if 문 가장 기본적인 조건문은 if 문입니다. if문은, "~~하다면 ~~를 해라" 를 의미합니다. 예시 코드를 한번 봅시다. const a = 1; if (a + 1 === 2) { console.log('a + 1 이 2 ..

[펌] 벨로퍼트와 함께하는 모던 자바스크립트 https://learnjs.vlpt.us/basics/03-operator.html 03. 연산자 · GitBook 03. 연산자 연산자에 대해서 알아봅시다. 연산자는 프로그래밍 언어에서 특정 연산을 하도록 하는 문자입니다. 예를 들어서, 우리가 변수와 상수를 배울 때 다음과 같은 코드를 작성했었지요? let learnjs.vlpt.us 연산자에 대해서 알아봅시다. 연산자는 프로그래밍 언어에서 특정 연산을 하도록 하는 문자입니다. 예를 들어서, 우리가 변수와 상수를 배울 때 다음과 같은 코드를 작성했었지요? let value = 1; // 변수 선언 value = 2; // 대입 연산자 여기서 두번째 줄에서 사용된 = 문자가 바로 연산자입니다. 연산자의 종류..

[펌] 벨로퍼트와 함께하는 모던 자바스크립트 https://learnjs.vlpt.us/basics/02-variables.html 02. 변수 · GitBook 02. 변수와 상수 변수와 상수에 대해서 알아봅시다. 변수와 상수는, 특정 이름에 특정 값을 담을 때 사용합니다. 예를 들어서 우리가 value 라는 이름에 1 이라는 값을 넣는다고 가정해봅시다. 그러 learnjs.vlpt.us 변수와 상수에 대해서 알아봅시다. 변수와 상수는, 특정 이름에 특정 값을 담을 때 사용합니다. 예를 들어서 우리가 value 라는 이름에 1 이라는 값을 넣는다고 가정해봅시다. 그러면, 코드를 이렇게 입력하면 됩니다. let value = 1; 그러면, 앞으로 우리가 value 를 조회하면 value 는 1을 가르키게..

[펌] 벨로퍼트와 함께하는 모던 자바스크립트 https://learnjs.vlpt.us/basics/01-hello-javascript.html 01. Hello JavaScript · GitBook 자바스크립트는 여러분의 브라우저에서 언제든지 사용 할 수 있습니다. 만약 현재 여러분이 크롬브라우저가 아닌 다른 브라우저를 사용중이라면 크롬을 설치하여 실행해보세요. 그리고 개발자 learnjs.vlpt.us 자바스크립트는 여러분의 브라우저에서 언제든지 사용 할 수 있습니다. 만약 현재 여러분이 크롬브라우저가 아닌 다른 브라우저를 사용중이라면 크롬을 설치하여 실행해보세요. 그리고 개발자 도구를 열어보세요. 개발자 도구는 윈도우 Ctrl + Shift + I 또는 macOS Command + Option + ..