超棒的響應(yīng)式布局jQuery插件Freetile.js
我們?cè)?jīng)介紹過(guò)倆款知名的響應(yīng)式布局插:isotope和masonary,今天我們這里再介紹一款相當(dāng)不錯(cuò)的響應(yīng)式布局插件 –Freetile.js,使用它同樣可以生成超酷的動(dòng)態(tài)布局效果。相信大家一定會(huì)喜歡!
主要特性
Freetie來(lái)自于Assemblage和Assemblage Plus的內(nèi)建布局引擎,設(shè)計(jì)靈感來(lái)自于Masonry,VGrid和Wookmark,但是和他們相比較,擁有以下獨(dú)特的地方:
允許包含任何尺寸的元素,并且不要求一個(gè)固定的列寬度,因此你不需要指定列寬度來(lái)迎合你的元素大小內(nèi)建算法允許你很容易的自定義插入的位置,滿足不同喜好的展示方式。例如,向左或者向右對(duì)齊,或者接近特定元素。智能的動(dòng)畫(huà)方式能夠很好的判斷是否需要?jiǎng)赢?huà)特效。例如,剛加入的元素和不可見(jiàn)的元素。只要使用Assemblage 和 Assemblage Plus模板的網(wǎng)站都在使用它,所以說(shuō)非常穩(wěn)定。如何使用
基本使用方式:
Js代碼
啟用動(dòng)畫(huà)特效:
Js代碼
指定一個(gè)自定義的元素選擇器:
Js代碼
是不是很簡(jiǎn)單,有需要的話可以直接拿走哈,千萬(wàn)別跟我客氣。
- CSS3+Js實(shí)現(xiàn)響應(yīng)式導(dǎo)航條
- 原生JS實(shí)現(xiàn)響應(yīng)式瀑布流布局
- avalonjs制作響應(yīng)式瀑布流特效
- Bootstrap實(shí)現(xiàn)響應(yīng)式導(dǎo)航欄效果
- Bootstrap每天必學(xué)之響應(yīng)式導(dǎo)航、輪播圖
- 開(kāi)啟BootStrap學(xué)習(xí)之旅
- BootStrap響應(yīng)式導(dǎo)航條實(shí)例介紹
- bootstrap網(wǎng)頁(yè)框架的使用方法
- 20分鐘成功編寫(xiě)bootstrap響應(yīng)式頁(yè)面 就這么簡(jiǎn)單
- 使用bootstrap3開(kāi)發(fā)響應(yīng)式網(wǎng)站
相關(guān)文章
jQuery實(shí)現(xiàn)Tab選項(xiàng)卡切換效果簡(jiǎn)單演示
這篇文章向大家推薦了一個(gè)jQuery實(shí)現(xiàn)Tab選項(xiàng)卡切換效果的簡(jiǎn)單演示,感興趣的小伙伴們可以參考一下2015-11-11WEB前端開(kāi)發(fā)都應(yīng)知道的jquery小技巧及jquery三個(gè)簡(jiǎn)寫(xiě)
一個(gè)簡(jiǎn)單技巧的集合,幫你提升 jQuery 技能,下面腳本之家小編給大家收集整理了web前端開(kāi)發(fā)都應(yīng)知道的jquery小技巧,對(duì)jquery小技巧感興趣的朋友一起學(xué)習(xí)吧2015-11-11jquery trigger函數(shù)執(zhí)行兩次的解決方法
這篇文章主要介紹了jquery trigger函數(shù)執(zhí)行兩次的解決方法,詳細(xì)分析了trigger函數(shù)執(zhí)行兩次的原因與響應(yīng)的解決技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2016-02-02表頭固定(利用jquery實(shí)現(xiàn)原理介紹)
表頭固定應(yīng)該是一個(gè)用得比較多的功能,參考了網(wǎng)上幾個(gè)例子,在幾個(gè)常用瀏覽器下顯示不是很完美2012-11-11jquery動(dòng)態(tài)添加以及遍歷option并獲取特定樣式名稱(chēng)的option方法
下面小編就為大家分享一篇jquery動(dòng)態(tài)添加以及遍歷option并獲取特定樣式名稱(chēng)的option方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-01-01jquery struts 驗(yàn)證唯一標(biāo)識(shí)(公用方法)
本教程將為大家詳細(xì)介紹下使用公用方法驗(yàn)證jquery struts唯一標(biāo)識(shí),感興趣的朋友可以參考下哈,希望可以幫助到你2013-03-03jQuery簡(jiǎn)單實(shí)現(xiàn)對(duì)數(shù)組去重及排序操作實(shí)例
這篇文章主要介紹了jQuery簡(jiǎn)單實(shí)現(xiàn)對(duì)數(shù)組去重及排序操作,結(jié)合實(shí)例形式分析了jQuery中unique方法進(jìn)行數(shù)組去重及sort方法排序的相關(guān)操作技巧,需要的朋友可以參考下2017-10-10jquery 判斷滾動(dòng)條到達(dá)了底部和頂端的方法
這篇文章主要介紹了jquery 判斷滾動(dòng)條到達(dá)了底部和到達(dá)頂端的方法,需要的朋友可以參考下2014-04-04jQuery插件實(shí)現(xiàn)的日歷功能示例【附源碼下載】
這篇文章主要介紹了jQuery插件實(shí)現(xiàn)的日歷功能,結(jié)合完整實(shí)例形式分析了jQuery datepicker插件實(shí)現(xiàn)日歷功能的相關(guān)操作技巧,需要的朋友可以參考下2018-09-09