Home >Web Front-end >JS Tutorial >Awesome responsive layout jQuery plug-in Freetile.js_jquery

Awesome responsive layout jQuery plug-in Freetile.js_jquery

WBOY
WBOYOriginal
2016-05-16 16:31:071772browse

Online demo

We have introduced two well-known responsive layout plug-ins: isotope and masonary. Today we will introduce a pretty good responsive layout plug-in – Freetile.js, you can also use it to generate cool dynamic layout effects. I believe everyone will like it!

Main Features

Freetie comes from the built-in layout engines of Assemblage and Assemblage Plus. Its design is inspired by Masonry, VGrid and Wookmark, but compared with them, it has the following unique features:

Allows elements of any size and does not require a fixed column width, so you do not need to specify column widths to cater to your element sizes. Built-in algorithms allow you to easily customize the insertion position to suit different preferences Display method. For example, align to the left or right, or close to a specific element. The intelligent animation method can well determine whether animation special effects are needed. For example, newly added elements and invisible elements. As long as the websites using Assemblage and Assemblage Plus templates are using it, it is very stable. How to use

Basic usage:

Js code

Copy code The code is as follows:
$('#container').freetile();

Enable animation effects:

Js code

Copy code The code is as follows:
$('#container').freetile({animate: true,elementDelay:30});

Specify a custom element selector:

Js code

Copy code The code is as follows:
$('#container').freetile({selector: '.thumbs'});

Isn’t it very simple? If necessary, you can just take it away. Don’t be polite to me.

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn