200字范文,内容丰富有趣,生活中的好帮手!
200字范文 > ajax瀑布流插件 jquery瀑布流插件(WookMark)

ajax瀑布流插件 jquery瀑布流插件(WookMark)

时间:2023-03-16 03:40:31

相关推荐

ajax瀑布流插件 jquery瀑布流插件(WookMark)

瀑布流布局效果目前来说还是挺流行的,从网页到手机应用,都能见到瀑布流的身影。网上也有很多关于这个的介绍,这里就稍微介绍下,留个备份存档

相比较手机应用来说,感觉网页上的瀑布流布局效果实现简单很多,因为我们有现成的jQuery插件可以用,只要稍微的引用一下,再写那么一两句调用代码,然后就没我们什么事了,瀑布流就这么呈现出来了。

效果图:

Wookmark这个插件的用法也是相当的简单。

引入jQuery和wookmark

[html]

[/html]

HTML代码

[html]

1

2

3

4

5

6

7

8

9

10

11

12

13

[/html]

应用wookmark

[js]$(document).ready(new function() {

$(‘#tiles li’).wookmark({

autoResize: true, // 当浏览器大小改变时是否自动调整

container: $(‘#tiles’), // 父容器,这个要注意的一点是该容器需要有 position: relative 属性。

offset: 2, // 每个元素之间的距离

itemWidth: 210 // 每个元素的宽度,瀑布流高度是不限制的,所以只要宽度固定就可以了

});

});

[/js]

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。