sachinchoolur / lightslider

JQuery lightSlider is a lightweight responsive Content slider with carousel thumbnails navigation
http://sachinchoolur.github.io/lightslider/
MIT License
2.04k stars 1.52k forks source link

Thumbnail is adding an additional number and last thumb does not show #470

Open timothymarois opened 3 years ago

timothymarois commented 3 years ago

Something is just not right here,

first, the last thumb won't show on larger screens, shrink the screen and it appears, and second, it is adding an additional thumbnail that is just a number and no image, does not match the list items. Can't find a way to remove it.

Screen Shot 2021-03-05 at 2 47 26 PM

You can see it on the 4th item.

Code I'm using:

$("#lightSlider").lightSlider({
            item: 1,
            autoWidth: true,
            // slideMove: 1, 
            // slideMargin: 10,
            slideMargin: 0,

            addClass: '',
            mode: "slide",
            useCSS: true,
            cssEasing: 'ease', 
            easing: 'linear',

            speed: 400,
            auto: false,
            loop: false,
            slideEndAnimation: true,
            pause: 2000,

            // keyPress: false,
            // controls: true,
            // prevHtml: '',
            // nextHtml: '',

            // rtl:false,
            adaptiveHeight:true,

            // vertical:false,
            // verticalHeight:500,
            // vThumbWidth:200,

            thumbItem:6,
            pager: true,
            gallery: true,
            // galleryMargin: 5,
            // thumbMargin: 5,
            currentPagerPosition: 'left',

            enableTouch:false,
            enableDrag:false,
            freeMove:false,
            // swipeThreshold: 40,
            // responsive : [],

            // onBeforeStart: function (el) {},
            // onSliderLoad: function (el) {},
            // onBeforeSlide: function (el) {},
            // onAfterSlide: function (el) {},
            // onBeforeNextSlide: function (el) {},
            // onBeforePrevSlide: function (el) {},

            onSliderLoad: function(el) {
                el.lightGallery({
                    selector: '#lightSlider .lslide' // only #imageGallery .lslide will be added in to the lightGallery
                });
            }   
        });

Even if I just do 1 image, it still adds a second thumb called 2

Screen Shot 2021-03-05 at 2 51 11 PM
timothymarois commented 3 years ago

After testing, seems related to using autoWidth : true setting