# Gallery 图片画廊 --- 图片画廊组件，用于展示图片为主体的内容。 **演示图标版权归[微软 Bing](http://www.bing.com) 所有。** ## 使用方法 ### 直接使用 - 拷贝演示中的代码，粘贴到 Amaze UI HTML 模板（[点此下载](/getting-started)） `` 区域； - 将示例代码中的内容替换为自己的内容。 ### 使用 Handlebars 本组件 Handlebars partial 名称为 `gallery`，使用细节参照[折叠面板组件](/widgets/accordion)。 ### 云适配 WebIDE - 将组件拖入编辑界面； - 点击右侧面板里的【数据采集】按钮，按以下格式采集数据。 ```javascript var data = [ { "img": "", // 图片地址 "link": "", // 填写点击图片弹出放大时的图片路径 "title": "", // 图片标题 "desc": "" // 附加信息，支持DOM，为高级定制提供DOM接口 } ]; return data; ``` ## 指定缩略图 基于节省流量考虑，可以指定缩略图，用户点击放大的时候再显示大图。 ### 使用 `data-rel` 将大图放在 `` 的 `data-rel` 属性上。 `````html ````` ```html ``` ### 使用链接 设置 `target`: `data-am-gallery="{pureview:{target: 'a'}}"`。 从可访性的角度而言，这种方式更好一些：用户再禁用 JavaScript 以后仍然可以打开链接查看大图。 `````html ````` ```html ``` ## 不使用微信图片查看器 如果在微信中打开时不想调用微信的图片查看器，可以通过以下选项关闭： ```html