Question

我很难复制lightSlider文档在“与lightGallery集成”标题下给出的示例中演示的功能（遗憾的是没有永久链接）：http://sachinchoolur.github.io/lightslider/examples.html

示例中演示的功能正是我项目中所需的功能。这是我的代码版本只能部分工作，这些是问题：

缺少右箭头
区域似乎向右不受限制，延伸到可见图像之外

点击图片调出lightGallery后，右上方的X按钮无法关闭

<body>
    <ul id="imageGallery">
        <li data-thumb="http://sachinchoolur.github.io/lightslider/img/thumb/cS-7.jpg" data-src="http://sachinchoolur.github.io/lightslider/img/cS-7.jpg">
            <img src="http://sachinchoolur.github.io/lightslider/img/cS-7.jpg" />
        </li>
        <li data-thumb="http://sachinchoolur.github.io/lightslider/img/thumb/cS-7.jpg" data-src="http://sachinchoolur.github.io/lightslider/img/cS-7.jpg">
            <img src="http://sachinchoolur.github.io/lightslider/img/cS-7.jpg" />
        </li>
        <li data-thumb="http://sachinchoolur.github.io/lightslider/img/thumb/cS-7.jpg" data-src="http://sachinchoolur.github.io/lightslider/img/cS-7.jpg">
            <img src="http://sachinchoolur.github.io/lightslider/img/cS-7.jpg" />
        </li>
    </ul>
    <script>
        $(document).ready(function() {
            $('#imageGallery').lightSlider({
                gallery:true,
                item:1,
                loop:true,
                thumbItem:9,
                slideMargin:0,
                enableDrag: false,
                currentPagerPosition:'left',
                onSliderLoad: function(el) {
                    el.lightGallery({
                        selector: '#imageGallery .lslide'
                    });
                }   
            });  
        });
    </script>
</body>

无法在lightSlider文档中重现该示例

0 个答案: