Daily coding

focus( ) : 해당 태그로 커서가 옮겨갔을 때 호출 = mouseover( ) blur( ) : 해당 태그에서 포커스가 벗어났을 때 호출 = mouseout( ) dblclick( ) : 더블클릭 시 호출 이름: 이메일: 여기가 p tag 1입니다 여기가 p tag 2입니다 hide() : 태그 감추기 show() : 태그 보여주기 toggle() : 번갈아가며 show / hide * mouseenter(): 적용한 개체에 마우스를 올리면 실행, mouseover와 비슷하게 작동하지만, mouseover는 자식객체에도 함수의 적용이 되어 안쪽에 위치한 자식객체로 마우스커서를 옮기면 함수 적용이 되지 않는다 그러나 mouseenter는 적용한 그 객체의 바운더리 안에 있을 때 실행이 되기 때문에 안..

// file을 읽어왔다고 가정 // 테이블에 넣을 데이터 정의 var woman = [// 테이블에 넣을 배열 임의적으로 작성하기 ["", ""],// --> 열 목록에 들어갈 것이기 때문에 빈칸 ["aaa", "01:06:11"], ["bbb", "01:08:31"], ["ccc", "01:16:55"] ]; var man = [ ["", ""], ["AAA", "01:07:11"], ["BBB", "01:08:55"], ["CCC", "01:10:32"] ]; // 테이블 th와 td데이터 삽입하기 $(function () { //$("tr:even").css("background-color", "green"); // even : 짝수에 함수 적용하기 , odd :홀수 // 위의 코드는 짝수번째 인..

* List에 접근하는 방법 // 다중 리스트로 구성된 구조를 정의 Coffee black milk Tea Milk // JQuery로 리스트의 요소들 가져오기 2.show ( ) : 해당 태그를 나타낸다.

기본함수 : mouseover / mouseout 1, Java Script 방식 mouseover in JS java script > jQuery : 자바스크립트가 우선시 됨 h3 tag class cls

* JQuery 기본 함수 1> Click : 태그 클릭시 호출 $("p").click( function () { 클릭시 호출 }); */ * id / class 적용 div 태그 안에 있는 p태그만 적용 $('div p').click(function () { alert("div p tag click") }); */ /* // div안에 클래스명이 cls인 태그에만 적용 $('div .cls').click(function () { alert("div p tag click") }); */ > 의 개념 // div태그 안에 존재하는 모든 p(자식 + 자손) $('div p).click(function () { alert("div p tag click") }); // div태그 바로 밑에 존재하는 자식 태그(..

1> JQuery 시작하기 : 제이쿼리는 스크립트문에서 사용할 수 있다. JQuery를 사용 시 페이지를 먼저 로드한 후에 함수를 실행하는 방식과, 함수부터 불러오는 방식이 존재한다. 1 ) 페이지를 로드 후 함수 실행 $(document).ready(function func() { jquery 및 함수 작성 }); 2 ) 함수부터 실행 $(function() { }); 2 > 기본 함수 : JQuery는 함수로 데이터를 모으거나 설정한다. ** id / class / name id : js에서 데이터를 조작할 때 사용하는 고유한 속성, JQuery에서 #으로 표현 EX> $("#ptag").html( '안녕하세요' ); ---> '' 안의 문자열 설정하는 jquer..

JQuery JavaScript : client(front), web 서버와 관련없음 - 주목적 : 화면의 resource와 값을 설정, 취득하는 부분을 처리 - DOM(getElementById, nodelist) CSS (Cascading Style Sheet) : 디자인. front JQuery : 자주 사용하는 자바 스크립트를 경량화 시킨 것. java script를 통해서 제작함. - Ajax(비동기 통신) - 여기가 p태그 입니다. p tag id demo p tag class cls h3 tag class cls

https://www.w3schools.com/w3js/w3js_html_include.asp

* background : 어트리뷰트를 사용하면 배경이미지를 설정하고 이미지 반복여부 등을 지정할 수 있다 - background-image: url ( '이미지 주소'); ---> 원하는 이미지를 배경으로 세팅 - background-repeat : 배경이미지의 반복여부를 설정 (default : 바둑판식) 1. repeat-x : 가로로만 반복 2. repeat-y : 세로로만 반복 3. none : 반복없음 - background-position : 배경사진의 위치를 지정할 수 있다. (위, 아래, 왼, 오, 가운데 ) top/bottom , right, center, left (2개의 속성을 동시에 지정도 가능 예 - top left ) - background-size : 배경화면의 사이즈를 정할..

background: linear-gradient ( to bottom, #ddeeff, #aabbdd); * to-top : 아래에서 위로 그러데이션 생성 to-left : 오른쪽에서 왼쪽으로 그라데이션 생성 to-right : 왼쪽에서 오른쪽으로 그라데이션 생성 to-bottom : 위에서 아래로 그라데이션 생성 (기본) ** 그라데이션 조합을 만들어주는 사이트 http://www.colinkeany.com/blend/ Blend—Create and customize beautiful CSS3 gradients. Blend—Create and customize beautiful CSS3 gradients. www.colinkeany.com https://uigradients.com/#TalkingTo..