图片灯箱

主题没有集成灯箱,图片过小,无法看清具体内容

图片灯箱
点击图片,弹出并放大,再点击即恢复

如何食用zoom呢?

第一步,引用zoom.css和引用zoom.js

<link href="css/zoom.css" rel="stylesheet">
<script src="js/zoom.js"></script>

zoom需要transition.js支持,引用

<script src="js/transition.js"></script>

最后在需要弹出放大的图片带上data-action="zoom"

<img src="img/blog_post_featured.png" data-action="zoom">

代码下载:

立即下载