search

seiyria / bootstrap-slider

A slider control for Bootstrap 3 & 4.
http://seiyria.github.io/bootstrap-slider/
Other
3k stars 1.14k forks source link

Question : why ticks label are not in the tick HTML element ? #910

Open Pontax opened 5 years ago

Pontax commented 5 years ago

Hello, My problem is that I'm in horizontal orientation and I would like to adapt the slider's width to the parent. So, I've set the width to 100% but the tick' labels have a calculated width in px and before a click or a window resize, labels are wrong-positioned, while ticks a well positioned.

After looking at source code, I have a question : why the HTML element corresponding to the label is not inside the HTML element representing the tick ?

seiyria commented 5 years ago

Try calling refresh on the slider instance after resizing is done.

Pontax commented 5 years ago

OK, I have called the refresh method on the window.load event. I could tell that it's working but I have a blinking display : labels are shown at a first position, then the refresh occurs and move the labels at their right positions.

Why don't you instantiate the slider on this event ? This way, the size of elements is known and tick labels will be well positioned. 

var self = this;
$(window).load(function(){
    instance = new PluginClass( self, options );
    $.data( self, namespace, instance );
});