点击图片放大的效果

最新推荐文章于 2020-02-19 18:26:05 发布

520_HL

最新推荐文章于 2020-02-19 18:26:05 发布

阅读量186

点赞数

分类专栏：前台效果文章标签：灯箱插件

本文链接：https://blog.csdn.net/qq_42917455/article/details/82935185

版权

前台效果专栏收录该内容

6 篇文章 0 订阅

订阅专栏

第一步，要下载灯箱这个插件
连接：链接: https://pan.baidu.com/s/1o1mYq5oIfo87YSQF9kjy8w 提取码: used
下载并且解压到本地
3.1本地的灯箱解压如图
进入src 目录如下图

5.1 项目目录如下

6.HTML页面代码

<head>
	<meta charset="utf-8" />
	<title></title>
	<script src="js/jquery-1.10.2.min.js"></script>
	<script src="js/lightbox.min.js"></script>
	<link href="css/lightbox.css" rel="stylesheet" />
</head>

<body>
	<a href="img/1.png" data-lightbox="1" data-title="My caption"><img style="width: 50px; height: 50px;" src="img/1.png" /></a>
</body>

效果图如下：

1 放大前
在这里插入图片描述
2点击图片后

520_HL

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
点击图片放大的效果

第一步，要下载灯箱这个插件连接：链接: https://pan.baidu.com/s/1o1mYq5oIfo87YSQF9kjy8w 提取码: used下载并且解压到本地创建一个HTML页面本地的灯箱解压如图5.1 进入src 目录如下图5.2 项目目录如下6.HTML页面代码&amp;amp;amp;amp;amp;lt;head&amp;amp;amp;amp;amp;gt; &amp;amp;amp;amp;amp;lt;meta charse
复制链接

扫一扫