PROMULGATOR

    me

    安徽省宿州市
    Html
    Css
    Js
1
2
3
4
5
6
7
8
<div id="box">
    <ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
* {
    padding:0px;
    margin:0px;
}
#box {
    width:1150px;
    margin:100px auto;
}
#box ul li {
    list-style:none;
    width:250px;
    background:#fff;
    float:left;
    padding:5px;
    margin:5px;
    box-shadow:0px 0px 5px #000;
}
img {
    width:250px;
    transition:1s;
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
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
32
33
34
35
36
37
38
39
40
41
42
43
var arr = [{
        src: "http://www.jq22.com/img/cs/500x300-1.png"
    },
    {
        src: "http://www.jq22.com/img/cs/500x300-2.png"
    },
    {
        src: "http://www.jq22.com/img/cs/500x300-3.png"
    },
    {
        src: "http://www.jq22.com/img/cs/500x300-4.png"
    },
    {
        src: "http://www.jq22.com/img/cs/500x300-5.png"
    },
    {
        src: "http://www.jq22.com/img/cs/500x300-6.png"
    },
    {
        src: "http://www.jq22.com/img/cs/500x300-7.png"
    },
    {
        src: "http://www.jq22.com/img/cs/500x300-8.png"
    },
    {
        src: "http://www.jq22.com/img/cs/500x300-9.png"
    },
    {
        src: "http://www.jq22.com/img/cs/500x300-1.png"
    },
    {
        src: "http://www.jq22.com/img/cs/500x300-2.png"
    },
    {
        src: "http://www.jq22.com/img/cs/500x300-3.png"
    }
];
//生成图片
var i = 0;
function create() {
    //创建一个盒子来放置图片
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
↑上面代码改变，会自动显示代码结果 jQuery调用版本：1.11.3
 立即下载

jquery瀑布流布局

0