'css'에 해당되는 글 4건

 
  1. 2014.03.06 [CSS] 커스텀 체크박스 스타일시트 예제, 모바일용, ✔
  2. 2014.02.17 [JS/JQUERY] 제이쿼리 셀렉터 예제, jQuery Selector Example, siblings, prevAll, append, parent, css
  3. 2010.10.05 [JQUERY] JQuery Selector, 객체 선택 (9)
  4. 2010.03.08 [JS,CSS] 잘까먹는 속성, 함수들
2014. 3. 6. 09:27 COMPUTER/JAVASCRIPT, JQUERY
[CSS] 커스텀 체크박스 스타일시트 예제, 모바일용, ✔

누군가 만들어놓은 커스텀 체크박스 스타일 시트 입니다.

사용법은 <input type="checkbox" class="custom-check"........

처럼 쓰면 됩니다.





input[type=checkbox].custom-check{ 
    position: absolute; overflow:hidden; width:1px;height:1px; 
    clip:rect(0 0 0 0);margin:-1px;padding:0;border:0; 
} 

input[type=checkbox].custom-check + label.custom-check{ 
    display:inline-block; 
    padding-left:1em; 
} 

input[type=checkbox].custom-check:checked + label.custom-check:before{ 
    position:absolute;margin-left:-1em; 
    content:'✔'; 
}


댓글을 달아 주세요

2014. 2. 17. 09:30 COMPUTER/JAVASCRIPT, JQUERY
[JS/JQUERY] 제이쿼리 셀렉터 예제, jQuery Selector Example, siblings, prevAll, append, parent, css

나(this)의 상위를 제외한 같은레벨의 백그라운드 컬러를 빨간색으로 변경

$(this).parent().siblings().css("background-color", "red");


나의 상위중 클래스가 .txt_2인 가장 가까운 객체의 백그라운드 컬러를 빨간색으로 변경

$(this).parent().prevAll('.txt_2:first').css("background-color", "red");


div의 lang속성에 안두리를 포함한 태그안에 html추가

$('div[lang*="kaudo"]').append('<p class="title_3">안녕하세요.</p>');



댓글을 달아 주세요

2010. 10. 5. 15:08 COMPUTER/JAVASCRIPT, JQUERY
[JQUERY] JQuery Selector, 객체 선택
제이쿼리를 이용할때 절대 잊으면 안되는것.
바로 html의 객체들을 선택할줄 알아야 뭔가 하겠죠.


$("font")
태그타입(Element)으로 찾기 - <font>안두볼</font>

$("div,a")
div와 a태그들을 선택합니다.

$("#kaudo")
아이디로 선택 - <a id="kaudo" class="link" href="http://www.kaudo.com">안두리</a>

$(".link")
CSS 클래스명으로 선택 - <a id="kaudo" class="link" href="http://www.kaudo.com">안두리</a>

$("*")
모든 태그(Element)를 선택합니다.

등록할때는 이런식으로
var objTest=$("#test");

 
John Resig @ Kings of Code 08
John Resig @ Kings of Code 08 by jaf 저작자 표시비영리동일조건 변경허락

댓글을 달아 주세요

  1. UGG 영국의 온라인 판매는 자유롭게 백퍼센트 정품 보증과 함께 여러분의 개성을 보여주 UGGS 영국 부츠를 선택, 다양한 색상, 크기와 종류의 부츠를 제공합니다.

    2011.11.14 16:26 [ ADDR : EDIT/ DEL : REPLY ]
  2. 이용약관위배로 관리자 삭제된 댓글입니다.

    2014.12.04 18:30 [ ADDR : EDIT/ DEL : REPLY ]
  3. 이용약관위배로 관리자 삭제된 댓글입니다.

    2014.12.05 02:31 [ ADDR : EDIT/ DEL : REPLY ]
  4. 이용약관위배로 관리자 삭제된 댓글입니다.

    2014.12.07 08:05 [ ADDR : EDIT/ DEL : REPLY ]
  5. 이용약관위배로 관리자 삭제된 댓글입니다.

    2014.12.09 12:26 [ ADDR : EDIT/ DEL : REPLY ]
  6. 이용약관위배로 관리자 삭제된 댓글입니다.

    2014.12.10 03:07 [ ADDR : EDIT/ DEL : REPLY ]
  7. 이용약관위배로 관리자 삭제된 댓글입니다.

    2014.12.10 23:41 [ ADDR : EDIT/ DEL : REPLY ]
  8. 이용약관위배로 관리자 삭제된 댓글입니다.

    2014.12.12 00:07 [ ADDR : EDIT/ DEL : REPLY ]
  9. 이용약관위배로 관리자 삭제된 댓글입니다.

    2014.12.13 09:21 [ ADDR : EDIT/ DEL : REPLY ]

2010. 3. 8. 23:36 COMPUTER/JAVASCRIPT, JQUERY
[JS,CSS] 잘까먹는 속성, 함수들
객체로 지정한 태그들의 위치값을 알아낼 수 있다

TAG.clientLeft
TAG.clientTop
TAG.clientWidth
TAG.clientHeight
TAG.offsetLeft
TAG.offsetTop

영역안에서 글씨가 넘어가버릴때 여러줄로 강제
word-wrap:break-word;word-break:break-all

한줄로 표시하고 점점점처리

NOBR width:WIDTH;text-overflow:ellipsis;overflow:hidden


페이지에서 루프 돌릴때 사용

ID=setInterval("FUNCTION()",INTERVAL);
ID=setTimeout("FUNCTION()",INTERVAL);
clearInterval(ID);

댓글을 달아 주세요

최근에 올라온 글

최근에 달린 댓글