TRstory

# body 스크롤 중앙 도달시 클래스 추가/*** 바디 스크롤 중앙(_wH / 2) 클래스 추가 * 타겟 클래스 : .js-motions* 모션 클래스 : .m_active*/function motionActive() { var _wH = window.innerHeight; //$(window).innerHeight(); $('.js-motions').each(function() { var _t = $(this).offset().top + (_wH / 2); if ($(window).scrollTop() + _wH > _t) { $(this).addClass('m_active'); } else { ..

[ 텍스트 글자수 제한 ] 0 / 9

function trpScrollTop(selector){ var _position = $(selector).offset(); $( 'html, body' ).animate( { scrollTop: _position.top }, 500 );};

- jQuery css 크기 측정window 와 document 객체는 지원하지 않습니다. width, height 사용. method 설명 .outerWidth(true | false) 기본값(false) padding+border , (true) padding+border+margin .outerHeight(true | false) 기본값(false) padding+border , (true) padding+border+margin Hello // outerWidth:214 , outerWidth(true):234// outerHeight:114 , outerHeight(true):134

# 회전 플러그인 $(this).rotate({animateTo:-180 , duration:200})

출처 : javaScript jQuery 입문 6.10 instanceof 키워드 1) 객체가 어떠한 생성자 함수를 통해 생성됬는지 확인할때 instanceof 키워드 사용. 2) typeof , instanceof typeof => 타입을 알아냄 instanceof => 생성자함수를 알아냄 코드 6-29 instanceof 키워드 DOCTYPE html> // 생성자 함수를 선언합니다. function Student(name) { this.name = name; } // 생성자함수를 사용해 함수를 생성하여 변수에 담음. // 자바스크립트는 대소문자 구분합니다. var student = new Student('윤인성'); // Student 상속받은 student 함수 객체 생성방법 // instance..

출처 : javaScript jQuery 입문 T17-1 jQuery 기본 효과 animationtype 내용의 변경 효과 fade, slide speed 내용의 변경 속도 slow , normal, fast , 숫자 timeout 변경 효과가 적용되는 속도 숫자 (2000)기본값 type 내용의 변경 방식 Sequence, random, random_start containerheight 내용의 높이 auto , 숫자 코드 17-7 innerfade()메서드DOCTYPE html> * { margin:0px; padding:0px; } ul { list-style:none; } img { width:500px; height:350px; } $(document).ready(function () { // ..

Quick API Reference : http://oscarotero.com/jquery/ jQuery 속성선택자 요소[속성] 특정 속성을 가지고 있는 문서 객체를 선택함 요소[속성=값] 속성 안의 값이 특정 값과 같은 문서 객체를 선택함 요소[속성~=값] 속성 안의 값이 특정 값을 단어로써 포함하는 문서 객체를 선택함 요소[속성^=값] 속성 안의 값이 특정 값으로 시작하는 문서 객체를 선택함 요소[속성$=값] 속성 안의 값이 특정 값으로 끝나는 문서 객체를 선택함 요소[속성*=값] 속성 안의 값이 특정 값을 포함하는 문서 객체를 선택함 사용 예) $('input[type=text]').val("텍스트 값추가"); 1. jQuery 기본 필터 선택자 요소:odd 홀수 번째에 위치한 문서 객체르 선택함 ..

Effects version added: 1.0 1. .animate( properties, [duration,] [easing,] [complete] ) 2. .animate( properties, options ) : CSS 속성 집합의 사용자 지정 애니메이션을 수행 properties : 애니메이션쪽으로 이동합니다그렇게 CSS의 properties지도 속성. options : 추가 옵션 지도 방법으로 전달할 수 있습니다. 지원되는 키 : duration : 문자열이나 애니메이션이 실행됩니다 얼마나 오래 결정 번호입니다. easing : 전환에 사용할 기능을하는 완화 나타내는 문자열입니다. complete : 애니메이션이 완료되면 호출하는 함수. step : 애니메이션의 각 단계 이후에 호출하는 함수..

! jQuery 예약어 변경 var $$ = jQuery.noConflict(); $() ==> $$() 사용 ! 선언부분 생약 1. 태그로 접근 basic test_p test_em jQuery("p");jQuery("p em"); test_hasjQuery("div:has(p a)"); // div 안에 p 안의 a 태그를 찾음 2. 아이디 접근 : "부모>*" 자식 선택 : 자식만 적용받음 아이디 접근 : "부모 *" 후손 선택 : 자식밑에 후손 모두 적용 idTest1 idTest2 jQuery("#idName" >li);jQuery("p#idName" >li); jQuery("p *"); 3. 클래스 접근 classTest jQuery(".className"); jQuery("li.classNa..