티스토리 뷰
https://www.final-tiles-gallery.com/#!
<script type="text/javascript"> | |
| //<![CDATA[ | |
| jQuery(window).load(function(){ | |
| var $iso_container = jQuery('#portfolioList'), | |
| $containerProxy = $iso_container.clone().empty().css({ visibility: 'hidden' }), // create a clone that will be used for measuring container width | |
| $iso_items = $iso_container.find('li.item'); | |
| $iso_container.after( $containerProxy ); | |
| jQuery(window).smartresize( function() { | |
| var viewport = { width: jQuery(window).width(), height: jQuery(window).height() }; | |
| var columns = 6; | |
| if ( viewport.width <= 979 ) columns = 4; | |
| if ( viewport.width <= 767 ) columns = 2; | |
| if ( viewport.width <= 480 ) columns = 1; | |
| // calculate columnWidth | |
| var colWidth = Math.floor( $containerProxy.width() / columns ); | |
| // resize the element depending on the columns and browsers width. Also handle new DOM elements with livequery | |
| $iso_items.livequery(function(){ | |
| jQuery(this).css({ width: colWidth }); | |
| }) | |
| // set width of container based on columnWidth | |
| $iso_container.css({ | |
| width: colWidth * columns | |
| }) | |
| .isotope({ | |
| itemSelector : '.portfolio-list li.item', | |
| resizable: false, // disable automatic resizing when window is resized | |
| // set columnWidth option for masonry | |
| masonry: { | |
| gutterWidth: 0 //remove gutter | |
| } | |
| }); | |
| // trigger smartresize for first time | |
| }).smartresize(); | |
| $iso_container.css({ background: 'none' }).find('li.item').css({ visibility: 'visible' }); | |
| }); | |
| //]]> | |
| </script> |
'jquery' 카테고리의 다른 글
| [jQuery] td:eq(index) 테이블 선택 데이터 정보 가져오기 (0) | 2018.10.11 |
|---|---|
| jquery serialize (0) | 2018.10.01 |
| [jquery 그리드] 데이타 테이블 적용방법 - DataTables is a plug-in for the jQuery Javascript library (0) | 2017.06.21 |
| [ajax] ajax를 이용해 코드값을 select 태그로 만들어주기 (0) | 2017.06.12 |
| [jquery] radio 버튼 체크여부 알아보기 (0) | 2017.06.12 |
댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
TAG
- 파싱
- xe addon
- XE3
- proc
- 포인터
- 자바
- 파이썬
- ocajp
- 자바 smtp
- MySQL
- php
- 오라클
- 문자열
- KG
- webix
- ocjap
- 인포믹스
- 프로씨
- EC
- JDBC
- C
- xe애드온
- Python
- esql
- 플러터
- 스크래핑
- C언어
- XE
- 이클립스
- 라이믹스
| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | |||
| 5 | 6 | 7 | 8 | 9 | 10 | 11 |
| 12 | 13 | 14 | 15 | 16 | 17 | 18 |
| 19 | 20 | 21 | 22 | 23 | 24 | 25 |
| 26 | 27 | 28 | 29 | 30 | 31 |
글 보관함
