Code666 (代码贴、代码片段)

[JavaScript] 强大的图片浏览 →→→→→进入此内容的聊天室

来自 , 2020-04-25, 写在 JavaScript, 查看 93 次.
URL http://www.code666.cn/view/39461a19
  1. <ul id="jq22">
  2.         <li><img data-original="img/tibet-1.jpg" src="img/thumbnails/tibet-1.jpg" alt="图片1"></li>
  3.         <li><img data-original="img/tibet-2.jpg" src="img/thumbnails/tibet-2.jpg" alt="图片2"></li>
  4.         <li><img data-original="img/tibet-3.jpg" src="img/thumbnails/tibet-3.jpg" alt="图片3"></li>
  5.         <li><img data-original="img/tibet-4.jpg" src="img/thumbnails/tibet-4.jpg" alt="图片4"></li>
  6.         <li><img data-original="img/tibet-5.jpg" src="img/thumbnails/tibet-5.jpg" alt="图片5"></li>
  7.         <li><img data-original="img/tibet-6.jpg" src="img/thumbnails/tibet-6.jpg" alt="图片6"></li>
  8. </ul>
  9.  
  10. <script src="js/viewer.min.js"></script>
  11. <script>
  12. var viewer = new Viewer(document.getElementById('jq22'), {
  13.         url: 'data-original'
  14. });
  15. </script>
  16. 将js引入即可data-original为原图的缩略图也可不写
  17. <img   title="${image.title}" src="${ctx}/sys/fileInfo/browse?id=${image.fileId}" style="width:132px;height:94px; " alt=""/>
  18. 或者直接写一个style规定大小

回复 "强大的图片浏览"

这儿你可以回复上面这条便签

captcha

贴代码片段 - Code666