height 100% layout css

일반적으로 많이 쓰는  height 100% layout 과는 약간 다른 방식이다.
http://peterned.home.xs4all.nl/examples/csslayout1.html


jquery live toggle jquery

ajax 등으로 동적으로 뿌려지는 데이터에 toggle 기능을 사용해야 할 때가 있다.

이럴 때는 다소 난감할 수 있는데, 아래와 같은 훌륭한 해결책이 있다.

아래와 같은 경우라면,

$(".reply").toggle
(
    function ()
    {
        x1();
    },
    function ()
    {
        x2();
    }
);

아래와 같이 간단하게 손을 봐서 해결할 수 있다.



$(".reply").live('click', function () {
    $(this).toggle(
            function () {
                x1();
            },
            function () {
                x2();
            }
        );
    $(this).trigger('click');
});

jquery 좌표값 구하기 jquery

자주 까먹는 것이라 미리 적어둡니다.ㅎㅎ

 

box11초마다 변경된 값 조정
innerWidth() : 400 box사이즈(padding,scrollBar포함)
outerWidth() : 402 box사이즈(border,padding,scrollBar포함)
position().top : 50 parent(wrap)로 부터 위치
offset().top : 101 document로 부터 위치
height() : 250 style에 작성한 사이즈
offsetParent().offset().left : 50 parent에 접근
$(window).height(): 983 브라우저 화면사이즈
$(document).height(): 1052 문서사이즈
$(window).scrollTop() : 0 객체 스크롤 값

 

box2 $(this).bind 마우스좌표
clientX : 799 브라우저기준(스크롤무시)
clientY : 459 브라우저기준(스크롤무시)
pageX : 799 document기준
pageY : 459 document기준
offsetX : 799 객체기준(마우스가 지나는 객체가 변함)
offsetY : 459 객체기준(마우스가 지나는 객체가 변함)
screenX : 1049 모니터기준
screenY : 622 모니터기준

 

box3 $("#box3").bind 마우스좌표
offsetX : 34 객체기준
offsetY : -9 객체기준
e.pageX-$box3.offset().left:46 직접계산
e.pageY-$box3.offset().top:55 직접계산

 

다양한 이벤트 속성(프로퍼티)

altKey - alt키의 눌림 상태

clientX - 이벤트가 발생한 X좌표

clientY - 이벤트가 발생한 Y좌표

ctrlKey - ctrl키의 눌림상태

keyCode - 눌린문자키의 유니코드값

screenX - 스크린내의 X좌표

screenY - 스크린내의 Y좌표

shiftKey - shift키의 눌림여부

type - 이벤트의 종류

pageX - 페이지내의 상대 X좌표

pageY - 페이지내의 상대Y좌표

charCode - 눌린문자 키의 유니코드값

button -마우스 버튼상태

layerX - position 프로퍼티가 absolute인 경우, 현제 레이어의 상대X좌표

layerY - position 프로퍼티가 absolute인 경우, 현제 레이어의 상대Y좌표

target - 이벤트를 직접받는 객체

currentTarget - 현재 접근하는 엘리먼트

 

eval()  : 수식or문자열-> 실수

Number() : 문자 -> 숫자

String() : 숫자 -> 문자

escape() : 한글 -> 16진수

unescape() : 16진수 -> 한글

isFinite() :  유한수면 true, 무한수면 false

isNan() : 문자이면 true, 숫자면 false

parseInt(문자열, 진수) :  문자열-> 정수(원하는 진수 변환 가능)

parseFloat() : 문자열-> 부동소수점, 변환불가일때 NaN 반환


jquery carousel animate()로 만들기 jquery


네이버 뉴스캐스트 효과와 같은 jquery carousel jquery

jquery로 만든 waterwheel carousel.
아래 링크 참조.

데모 사이트 :

http://www.bkosborne.com/jquery-waterwheel-carousel


1 2 3 4 5 6