网页特效栏目收集了最全最新的前端网页插件,包括最流行的jQuery,Bootstrap,Js,Css,Vue等主流特效插件。
这是一款存css实现的lightbox灯箱图片画廊特效,使用简单。
使用方法:
1.在html页面中包含cssbox.css。
<link href="cssbox.css" rel="stylesheet">
2.然后将缩略图和完整图像插入网页,如下所示。
<div class="cssbox">
<a id="image1" href="#image1">
<img class="cssbox_thumb" src="images/1040-300x200.jpg">
<span class="cssbox_full">
<img src="images/1040-1280x768.jpg">
</span>
</a>
<a class="cssbox_close" href="#void"></a>
<a class="cssbox_next" href="#image2">></a>
</div>
<div class="cssbox">
<a id="image2" href="#image2">
<img class="cssbox_thumb" src="images/1025-300x200.jpg">
<span class="cssbox_full">
<img src="images/1025-1280x768.jpg">
</span>
</a>
<a class="cssbox_close" href="#void"></a>
<a class="cssbox_prev" href="#image1"><</a>
<a class="cssbox_next" href="#image3">></a>
</div>
<div class="cssbox">
<a id="image3" href="#image3">
<img class="cssbox_thumb" src="images/1044-300x200.jpg">
<span class="cssbox_full">
<img src="images/1044-1280x768.jpg">
</span>
</a>
<a class="cssbox_close" href="#void"></a>
<a class="cssbox_prev" href="#image2"><</a>
</div>
转载请注明来源:纯CSS实现的lightbox灯箱图片画廊效果代码
本文永久链接地址:https://www.moyouyouw.cn/code/721.html
郑重声明:本站所有主题/文章除标明原创外,均来自网络转载,版权归原作者所有,如果有侵犯到您的权益,请联系本站删除,谢谢!我们不承担任何技术及版权问题,且不对任何资源负法律责任。
已有 位小伙伴发表了看法
欢迎 你 发表评论