文档章节

lightGallery实现手机端简单相册浏览功能

l
 luckxz999
发布于 2016/06/20 18:06
字数 173
阅读 17
收藏 0

第一步:引入相关文件

jQuery主文件:
<script src="jquery-1.9.1.min.js" type="text/javascript"></script>
lightGallery主文件
<script src="/lightGallery/js/lightGallery.min.js"></script>
<link rel="stylesheet" href="/lightGallery/css/lightGallery.css"/>

其中字体主要用于页面上小图标的展示,即

第二步:html组织及js初始化

<ul class="gallery">
    <li data-src="${largeImagePath1}">
        <a href="javascript:void(0)">
            <img class="box" src="${thumbImagePath1}"/>
        </a>
    </li>
    <li data-src="${largeImagePath2}">
        <a href="javascript:void(0)">
            <img class="box" src="${thumbImagePath2}"/>
        </a>
    </li>
    <li data-src="${largeImagePath3}">
        <a href="javascript:void(0)">
            <img class="box" src="${thumbImagePath3}"/>
        </a>
    </li>
</ul>
$(document).ready(function () {
    $(".gallery").lightGallery({
        loop:true,
        auto:true,
        speed:0,
        pause:5000,
        closable: false
    });
});

© 著作权归作者所有

共有 人打赏支持
l
粉丝 0
博文 5
码字总数 8084
作品 0
商丘
私信 提问
相册轮播

[作品和服务描述,建议100字以上] [产品功能] 轮播当前相册 切换上下相册 收藏相片 分享到微博,微信,人人,豆瓣等 手机扫描二维码在手机端浏览相片 全屏轮播相册 下载当前照片 [运行环境] p...

程序媛_Mickey
2016/05/18
5
0
近乎推出移动端 V2.0,社区进入“微时代”

“微时代”顾名思义,最明显的特征就是“微”。信息简短,即时性强,依赖于便携通讯设备。智能手机的普及程度不用说,这个小小的机器在短短几年内就渗透进我们生活的每个角落,而花样百出的手...

whp610
2014/04/17
2.7K
17
一款简约的 Hugo 主题 - LeaveIt

LeaveIt is a clean, elegant, simple but not simpler blog theme for Hugo. 主题特色 支持 Dark/Light 模式切换 图片懒加载 集成 lightGallery 图片相册方式显示 代码高亮 配置 CDN 地址后...

柳志超
09/13
0
0
微信音乐相册制作微信场景制作方法?源码?

现在智能手机非常的发达,许多网友都有希望在手机上分享音乐相册的想法,但是往往很多音乐相册的教程都不适应制作手机相册,微信相册,所以这篇文章特意介绍如何制作一个漂亮的微信音乐相册。...

我是一个小小草
2015/11/21
173
1
android中liestview 或则gridview 点击某个item图标,从服务器端怎么...

android中liestview 或则gridview 点击某个item图标,能够从服务器端怎么实现相册功能? 求解: 如图一所示:点击图一列表中的任何一张图标,都可以进入到对应自己的相册(如图二)可以同时左右...

原来是梦
2013/10/06
0
1

没有更多内容

加载失败,请刷新页面

加载更多

二十分钟教你如何将区块链应用与函数计算相结合

前言 本篇文章适合对区块链应用感兴趣或是想要通过函数计算服务进一步开发区块链应用的新人。本文将结合阿里云区块链服务、阿里云函数计算服务、阿里云日志服务 以及社区应用 Marbles,手把手...

阿里云官方博客
3分钟前
0
0
Double数相加后结果不准确

在我们进行两个double运算时,例如:2..0-1.1 不是想象的输出0.9,而是0.89999999999999999。其主要原因是浮点数值采用二进制系统表示,而在二进制系统中无法精确的表示分数1/10。这就好像十...

嘴角轻扬30
11分钟前
0
0
去除移动端点击效果

移动端点击时,会有一个类似active的短暂背景淡出效果,去除该效果可使用 -webkit-tap-highlight-color: rgba(255, 0, 0, 0);

originDu
12分钟前
0
0
腾讯云与MariaDB 基金会签署战略合作,共建全球开源生态圈

本文由云+社区发表 腾讯云日前与MariaDB基金会正式签署战略合作协议,2019年,腾讯云将继续以白金会员身份为基金会的发展提供强有力的资源支持,与MariaDB全球用户和开发者一道,共建开放共赢...

腾讯云加社区
17分钟前
1
0
Kotlin的SAM(Single Abstract Method)

今天有人在群里问kotlin支持SAM的问题,其实kotlin不支持SAM,因为人家支持FP(function programing) package reactinterface Test { fun print()}class TestInterface(var...

SuShine
19分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部