블로그 이미지
푸른_바람

Rss feed Tistory

jquery에 해당되는 글 4건

IT/Tech 2010/11/04 08:30

tag cloud 태그 구름 for jquery

참고

[code javascript]
<script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript" src="http://rohitsengar.cueblocks.net/tag-cloud/jquery.easing.js"></script> <script type="text/javascript" src="http://rohitsengar.cueblocks.net/tag-cloud/jquery.tagcloud.min.js"></script> <script type="text/javascript"> $(function{   $('#tag-cloud').tagCloud(); }); </script> [/code]
실제 적용화면

201.11.27

구글  크롬이 "http://rohitsengar.cueblocks.net" 사이트의 악성코드가 실행된다고 경고문구를 내 보내는군요. 그래서 실제 적용화면은 빼버렸습니다.

'IT > Tech' 카테고리의 다른 글

이클립스용 구글 플러그인 설치  (0) 2010/12/15
CI twitter oauth lib haughin ver3.1 bug  (0) 2010/11/12
tag cloud 태그 구름 for jquery  (0) 2010/11/04
eclipse "java heap space"  (0) 2010/11/03
svn: No repository found in svn://xxx.xxx.xxx.xxx/trunk  (0) 2010/11/02
javascript parse url  (0) 2010/11/01
cloud, javascript, JQuery, jquery.tagcloud.min.js, tag, tagcloud, 태그구름
트랙백 0, 댓글 0
IT/Tech 2010/07/31 14:45

javascript 이미지에 그레이스케일(grayscale) 적용

현재 프론트개발은 jquery로 개발중인 관계로 "jquery 이미지 gray 적용"으로 구글링 했습니다.

검색 : jquery 이미지 gray 적용
그레이스케일 소개 페이지 : “GRAYSCALING” IN NON-IE BROWSERS
데모 페이지 : http://james.padolsey.com/demos/grayscale/
소스 : http://james.padolsey.com/demos/grayscale/grayscrle.js/view

사용법
[code javascript]
var el = document.getElementById( 'myEl' );
grayscale( el );

# jQuery 에서 $(this) 가 이미지일 경우 적용
grayscale( $(this) );
[/code]

jQuery Plugin 에서 grayscale 검색 결과 : BlackNWhite 가 검색되긴 하지만 IE 전용입니다. 것도 필터로 gray를 적용하는군요

'IT > Tech' 카테고리의 다른 글

apt-get install sendmail  (0) 2010/08/07
PHP Fatal error: Allowed memory size of 8388608 bytes exhausted  (0) 2010/08/06
javascript 이미지에 그레이스케일(grayscale) 적용  (0) 2010/07/31
jQuery가 지원하는 고급 위치 기반 셀렉터  (0) 2010/07/30
jQuery가 지원하는 기본 CSS 셀렉터  (0) 2010/07/29
jquery bookmarklet 생성기  (0) 2010/07/20
grayscale, javascript, JQuery, 그레이스케일
트랙백 0, 댓글 0
IT/Tech 2010/07/30 08:30

jQuery가 지원하는 고급 위치 기반 셀렉터

jQuery가 지원하는 고급 위치 기반 셀렉터. DOM에서 위치를 기반으로 엘리먼트를 선택한다.
 셀렉터 설명
 :first  페이지에서 처음으로 일치하는 엘리먼트.
 li a:first는 리스트 아이템의 첫 번째 링크를 반환한다.
 :last  페이지 마지막으로 일치하는 엘리먼트.
 li a:last는 리스트 아이템의 마지막 링크를 반환한다.
 :frist-child 첫 번째 자식 엘리먼트.
 li:first-child는 각 리스트의 첫 번째 아이템을 반환한다.
 :last-child  마지막 자식 엘리먼트.
 li:last-child는 각 리스트의 마지막 아이템을 반환한다.
 :only-child 형제가 없는 모든 엘리먼트를 반환한다.
 :nth-child(n) n번째 자식 엘리먼트.
 li:nth-child(2)는 각 리스트의 두 번째 리스트 아이템을 반환한다.
 :nth-child(even|odd) 짝수 또는 홀수 자식 엘리먼트.
 li:nth-child(even)은 각 목록의 짝수 번째 자식 엘리먼트를 반환한다.
 :nth-child(Xn+Y) 전달된 공식ㅇ 따른 n번째 자식 엘리먼트.
 Y는 0인 경우 생략 가능하다.
 li:nth-child(3n)은 3의 배수 번째 아이템을 반환한다.
 li:nth-child(5n+1)은 5의 배수 + 1 번째 아이템을 반환한다.
 :even / :odd 페이지 전체의 짝수/홀수 번째 엘리먼트. li:even은 모든 짝수 번째 아이템을 반환한다.
 :eq(n) n번째로 일치하는 엘리먼트 (0 부터 시작)
 :gt(n) n번째 엘리먼트(포함되지 않음) 이후의 엘리먼트와 일치
 :lt(n) n번째 엘리먼트(포함되지 않음) 이전의 엘리먼트와 일치

* 다른 셀렉터는 0부터 시작되지만 n번째 자식 셀렉터는 1부터 시작된다.
n번째 자식 셀렉터는 CSS와 호환성을 유지하려고 인덱스를 1부터 시작한다. 하지만 jQuery 정의 셀렉터는 법용 프로그래밍 규약에 따란 인덱스를 0부터 시작한다.

jQuery in Action (프로그래밍 jQuery) : p28

'IT > Tech' 카테고리의 다른 글

PHP Fatal error: Allowed memory size of 8388608 bytes exhausted  (0) 2010/08/06
javascript 이미지에 그레이스케일(grayscale) 적용  (0) 2010/07/31
jQuery가 지원하는 고급 위치 기반 셀렉터  (0) 2010/07/30
jQuery가 지원하는 기본 CSS 셀렉터  (0) 2010/07/29
jquery bookmarklet 생성기  (0) 2010/07/20
LAMPP & 버추얼호스트 & XDebug  (0) 2010/07/20
CSS, JQuery, selector, 셀렉터
트랙백 0, 댓글 0
IT/Tech 2010/07/20 18:39

jquery bookmarklet 생성기

google code 에서 jquery를 활용해서 bookmarklet을 쉽게 구현할 수 있다.

하지만 IE8에서는 동작이... 안됨.  아니면 내 컴터만 안되는건가?

[code javascript]
javascript:(
  function(e,a,g,h,f,c,b,d){
    if(!(f=e.jQuery)||g>f.fn.jquery||h(f)){
      c=a.createElement("script");
      c.type="text/javascript";
      c.src="http://ajax.googleapis.com/ajax/libs/jquery/"+g+"/jquery.min.js";
      c.onload=c.onreadystatechange=function(){
        if(!b&&(!(d=this.readyState)||d=="loaded"||d=="complete")){
          h((f=e.jQuery).noConflict(1),b=1);f(c).remove()
        }
      };
      a.documentElement.childNodes[0].appendChild(c)
    }
  }
)(window,document,"1.3.2",function($,L){
  /* YOUR JQUERY CODE GOES HERE */
});
[/code]

 참고 : jQuery Bookmarklet Generator

'IT > Tech' 카테고리의 다른 글

jQuery가 지원하는 고급 위치 기반 셀렉터  (0) 2010/07/30
jQuery가 지원하는 기본 CSS 셀렉터  (0) 2010/07/29
jquery bookmarklet 생성기  (0) 2010/07/20
LAMPP & 버추얼호스트 & XDebug  (0) 2010/07/20
리눅스 관리를 위해서 알아햐할 모니터링 툴 20  (0) 2010/07/15
subversion + eclipse  (0) 2010/07/15
bookmark, bookmarklet, JQuery
트랙백 0, 댓글 0
1
TOTAL 245,655 TODAY 22