博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
图片点击放大满屏切换,可视图5张
阅读量:7155 次
发布时间:2019-06-29

本文共 761 字,大约阅读时间需要 2 分钟。

1.链接引用

<script type="text/javascript" src="js/jquery.min.js"></script>

<script type="text/javascript" src="src/images-grid.js"></script>

<link rel="stylesheet" href="src/images-grid.css">

2.html代码:

<p>More than five images</p>

<div id="gallery1"></div>

<p>Diff-size images</p>

<div id="gallery2"></div>

3.调用imagesGrid

$('#gallery1').imagesGrid({

images: [
'imgs/1.jpg',
{ src: 'imgs/2.jpg', alt: 'Second image', title: 'Second image' },
'imgs/3.jpg',
{ src: 'imgs/4.jpg', caption: 'Beautiful forest' },
'imgs/5.jpg'
]
});

$('#gallery2').imagesGrid({

images: [
'imgs/diff-size/1.jpg',
'imgs/diff-size/2.jpg',
'imgs/diff-size/3.jpg',
'imgs/diff-size/4.jpg',
'imgs/diff-size/5.jpg'
],
align: true
});

</script>

转载于:https://www.cnblogs.com/liuqingxia/p/6019338.html

你可能感兴趣的文章
ECCV 2018 | 旷视科技包揽COCO+Mapillary四项世界第一,中国公司成最大赢家
查看>>
Shiro Ajax请求没有权限返回JSON,没有登录返回JSON
查看>>
classList属性详解
查看>>
MYSQL-锁机制
查看>>
寻找List之和的最近素数
查看>>
程序员必知必会的那些邪恶的脚本
查看>>
Go 程序的基本结构和要素
查看>>
深入理解Java中的反射机制
查看>>
Git命令速查
查看>>
Android--解包、添加文件、打包、签名
查看>>
阿里云服务器ECS操作系统的分类
查看>>
HTML5 manifest离线缓存
查看>>
iframe父子页面通讯解决方案
查看>>
hive外表和事务表
查看>>
人工智能最终将超越人类,但不是反人类
查看>>
bearcat-dao 一个基于 SQL mapping 的 node.js DAO 框架
查看>>
还在担心机器人?人工智能目前水平还不如初中生
查看>>
菜鸟学Linux 第047篇笔记 bind97简单配置
查看>>
awk处理合并
查看>>
ubuntu16.04下怎么安装flash player
查看>>