>웹 프론트엔드 >JS 튜토리얼 >멋진 반응형 레이아웃 jQuery 플러그인 Freetile.js_jquery

멋진 반응형 레이아웃 jQuery 플러그인 Freetile.js_jquery

WBOY
WBOY원래의
2016-05-16 16:31:071768검색

온라인 데모

우리는 두 가지 잘 알려진 반응형 레이아웃 플러그인인 isotopemasonary를 소개했습니다. 오늘은 꽤 좋은 반응형 레이아웃 플러그인인 Freetile을 소개하겠습니다. Node.js를 사용하여 멋진 동적 레이아웃 효과를 생성할 수도 있습니다. 나는 모두가 그것을 좋아할 것이라고 믿습니다!

주요 기능

Freetie는 AssemblageAssemblage Plus에 내장된 레이아웃 엔진으로 구성되어 있으며 디자인은 Masonry, VGrid, Wookmark에서 영감을 얻었으나 이들과 비교하면 다음과 같습니다. 독특한 기능:

모든 크기의 요소를 허용하고 고정된 열 너비가 필요하지 않으므로 요소 크기에 맞게 열 너비를 지정할 필요가 없습니다. 내장된 알고리즘을 사용하면 다양한 기본 설정에 맞게 삽입 위치를 쉽게 사용자 정의할 수 있습니다. 방법. 예를 들어 왼쪽이나 오른쪽으로 정렬하거나 특정 요소에 가깝게 정렬합니다. 지능형 애니메이션 방법은 애니메이션 특수 효과가 필요한지 여부를 잘 결정할 수 있습니다. 예를 들어 새로 추가된 요소와 보이지 않는 요소 등이 있습니다. Assemblage와 Assemblage Plus 템플릿을 사용하는 웹사이트에서 사용하고 있는 한 매우 안정적입니다. 사용방법

기본 사용법:

JS 코드

코드 복사 코드는 다음과 같습니다.
$('#container').freetile();

애니메이션 효과 활성화:

Js 코드

코드 복사 코드는 다음과 같습니다.
$('#container').freetile( {animate: true,elementDelay:30});

맞춤 요소 선택기 지정:

Js 코드

코드 복사 코드는 다음과 같습니다.
$('#container').freetile( {선택기: '.thumbs'});

아주 간단하지 않나요? 필요하다면 그냥 가져가셔도 됩니다.

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.