-
[jQCloud] 간단하게 사용하는 TAG CLOUDHTML + JAVASCRIPT + CSS 2014. 8. 18. 16:44728x90
Tag Cloud 기술을 간단하게 사용할 수 있는 Jquery plugin 을 소개 합니다.
사용법은 간단 합니다.
/*! * Create an array of word objects, each representing a word in the cloud */ var word_array = [ {text: "Lorem", weight: 15}, {text: "Ipsum", weight: 9, link: "http://jquery.com/"}, {text: "Dolor", weight: 6, html: {title: "I can haz any html attribute"}}, {text: "Sit", weight: 7}, {text: "Amet", weight: 5} // ...as many words as you want ]; $(function() { // When DOM is ready, select the container element and call the jQCloud method, passing the array of words as the first argument. $("#example").jQCloud(word_array); });
과 같이 하면,
다음과 같은 UI가 표출 됩니다.
데이터만 잘 만들면 꽤나 유용한 기능을 제공 할 것이라 판단 됩니다.
참고로 위에 소스를 보면 아시듯이 TITLE과 LINK 기능을 지원 합니다.
샘플 : http://www.lucaongaro.eu/demos/jqcloud/
github : https://github.com/lucaong/jQCloud
728x90'HTML + JAVASCRIPT + CSS' 카테고리의 다른 글
[JAVASCRIPT] - 주소창의 parameter 제거 (0) 2017.03.09 Array.prototype.reduce VS for loop (0) 2015.09.22 [jsGantt]간트 차트 라이브러리 (0) 2014.09.03 requirejs 란 - 모듈정의, 모듈 로더 (0) 2014.08.29 [TIP]IE 에서 Window.open 시 오류 발생 (0) 2014.05.13