본문 바로가기
[제이쿼리] attr(), prop() attr("속성명","새값)-요소를 선택하여 지정한 속성에 새값을 적용​attr("속성명")- 선택한 요소의 지정한 속성값을 가져온다 removeAttr("속성명")-선택한 요소의 지정한 속성만 제거​prop("상태속성명")-선택한 요소의 상태 속성값을 가져온다.​prop("상태속성명,"새값")-요소를 선택하여 상태 속성에 새 값을 적용한다.. 더보기
제이쿼리 레퍼런스 사이트 https://codejss.tistory.com/57 더보기
transform - 사용 메모 - 웹 킷 기반 브라우저(크롬, 사파리): -webkit-transform - 파이어폭스: -moz-transform - 오페라: -o-transform transform: scale(1.5) , scaleX(2), translate(10px, 20px), skew(10deg,10deg); Transform 에 대한 효과를 강하게(?) 체험하고 싶다면 다음의 사이트를 방문해 보기 바란다 http://www.westciv.com/tools/3Dtransforms/index.html 더보기
JavaScript opener & self window 우선 JavaScript의 Window객체에는 Open()과 Close()라는 함수가 있다..각각의 함수는 (다들 아시겠지만) 이름대로 브라우저 창을 열고 닫아 주는 역할을 한다.Open()함수는 여기서 주가 아니므로 간단히 예만 보고 넘어가도록 하자.. window.open("b.html","_blank","direction=yes, location=yes, menubar=yes, scrollbars=yes, status=yes, toolbar=no, resizeble=no, width=300, height=300"); 이런 형태로 사용한다. 각각의 파라메터는 생략가능하다. 문제는 close()함수인데.. 사실 클로즈 함수 자체는 어려울게 없다. 대상윈도우에다가 사용하면 된다..예를 들어.. 자기 자신.. 더보기
CSS3의 애니메이션 ㅇ CSS3의 애니메이션 관련 속성 4가지 1. animation-duration : 애니메이션의 동작 시간('1s','0.5s'와 같은 형식으로 지정 2. animation-iteration-count : 애니메이션의 동작 회수('infinite'를 지정하면 무한 반복 3. animation-name : 애니메이션의 이름 4. animation-timing-function : 애니메이션의 타이밍 ㅇ animation-timing-function 속성에 지정할 수 있는 값의 의미 6가지 1. ease : 시작과 종료를 부드럽게 2. linear : 일정 3. ease-in : 서서히 시작 4. ease-out : 서서히 종료 5. ease-in-out : 서서히 시작하여 서서히 종료 6. cubic-be.. 더보기
제이쿼리 노트 ------------------------------------------------------------------------------------------------------------------------------------------------------ - 데스크톱뿐만 아니라 태블릿이나 스마트폰으로 접속할 것을 고려한다면, 브라우저 화면 너비가 변하더라도 스크롤 막대 없이 한 화면안에 내용이 들어오도록 해야 합니다. 그러려면 고정그리드를 가변그리드 레이아웃으로 바꾸면 됩니다. 가변그리드에서 너비를 계산하는 방법을 다시 확번 확인해 볼까요? (요소의 너비 / 콘텐츠를 모두 감싸는 요소의 너비) x 100 . 먼저 콘텐츠 전체를 감싸고 있는 #container의 너빗값 960px을 100%로.. 더보기
X-UA-Compatible, IE=Edge X-UA Compatibel IE8에서 새로이 추가된 기능이라고 한다. 해당 페이지의 렌더링 엔진을 설정할 수 있는 기능으로 이는 익스플로러의 버전에 따라서 렌더링 엔진이 다르기 때문이다. 구 버전의 IE를 기준으로 만들어진 웹페이지를 다른 버전의 IE가 접근 했을때 해당 브라우저의 렌더링이 달라져서 버그가 발생 할 수있다.렌더링 모드를 지정해주면 웹 페이지의 버전에 맞춰서 렌더링 엔진이 작동한다. 예를들어 익스7버전으로 페이지가 최적화 되어 있을 경우 브라우져 렌더링 엔진을 7번에 맞춘다. 이를 위해 개발시 meta태그(X-UA-Compatible)를 사용해서 IE에 어떤 렌더링 엔진을 적용시킬것인지를 정한다.IE의 렌더링 모드는 세 가지로 1. DOCTYPE에 의한 렌더링 모드를 지정하는 방법 2. .. 더보기
모바일 기기별 해상도 http://troy.labs.daum.net 기업별로 모바일 기기 선택 가능 삼성 겔럭시 시리즈 별로 기기별 해상도를 제공 하며 ~ 위의 모바일 기기 선택 후 상단에 URL을 입력하면 !! 아래와 같이 테스트 가능 ~ !!! 더보기
css 수평 수직 정렬 참고 http://poiemaweb.com/snippet-centering 더보기
@font-face @font-face { font-family: 'kakaoFont'; font-style: normal;/* 폰트 명 */ font-weight: 100; /* 폰트 스타일 설정 */ src: url('font/Kakao-aLt.eot');/* IE9 호환성 보기 */ src: src:local(※);,/* 웹 브라우저가 지원하지 않는 불필요한 웹 폰트 호출을 막는데 사용 */ url('font/Kakao-aLt.eot?#iefix') format('embedded-opentype'),/* IE6-IE8 */ url('font/Kakao-aLt.woff2') format('woff2'),/* WOFF의 차기 포맷 */ url('font/Kakao-aLt.woff') format('woff'),/* 표준 .. 더보기

티스토리툴바