这次使用了lightGallery,感觉还不错。样式比较美观,并且支持响应式。
使用过程中,我遇到了下面的问题:
当我 .picsgallery里面只有一个 .gItem的时候。点击弹出幻灯片,再点击幻灯片中的截图,视屏就是不播放。
<div id="video-id2" style="display:none;"> <video class="lg-video-object lg-html5 video-js vjs-default-skin" controls preload="none"> <source src="video/785342048.mp4" type="video/mp4"> Your browser does not support HTML5 video. </video> </div> <div class="picsgallery box clearfix"> <a class="gItem" data-poster="images/pic_39.jpg" data-sub-html="先行版预告片1" data-html="#video-id1"> <div class="bg" style="background-image:url(images/pic_39.jpg);"></div> <div class="com-play-button"><i class="fa fa-play-circle-o"></i></div> </a> </div>
于是各种搜,搜不到。于是只能改js源码:
源码208行,有下面这串代码,将> 改成 >= 即可。
1 if (_this.$items.length > 1) { 2 _this.arrow(); 3 4 setTimeout(function() { 5 _this.enableDrag(); 6 _this.enableSwipe(); 7 }, 50); 8 9 if (_this.s.mousewheel) { 10 _this.mousewheel(); 11 } 12 }