search

seiyria / bootstrap-slider

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

Problem before click #774

Closed fturiot closed 7 years ago

fturiot commented 7 years ago

Hello, Before click on slider, i have probleme with position of ticks label (all in small space) and tick-tooltips not in good positions. After click all is ok How can i solve this ? thanks for all

seiyria commented 7 years ago

Please provide an example of this.

On Wed, Aug 30, 2017, 4:21 AM TURIOT Frederic notifications@github.com wrote:

Hello, Before click on slider, i have probleme with position of ticks label (all in small space) and tick-tooltips not in good positions. After click all is ok How can i solve this ? thanks for all

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/seiyria/bootstrap-slider/issues/774, or mute the thread https://github.com/notifications/unsubscribe-auth/AAum2WwrmIdwzt3FfVC_mFvsOCYfmbVUks5sdSmwgaJpZM4PHGbC .

fturiot commented 7 years ago

Before click selection_004

After click selection_005

fturiot commented 7 years ago

And how can i keep color wen disable ?

WouterDeketelaere commented 7 years ago

I have exactly the same problem. You have to click on the slider before it is displayed correctly. I have two sliders, see pictures below <input id=outcome_slider" type="text" data-provide="slider" data-slider-tooltip="hide" data-slider-ticks="[1, 2, 3, 4, 5]" data-slider-ticks-labels="['All', 'Two', 'Three', 'Four', 'Five']" data-slider-ticks-snap-bounds="60"/> <input id="fc_slider_attribute" type="text" data-provide="slider" data-slider-tooltip="hide" data-slider-ticks="[1, 2, 3, 4, 5, 6, 7, 8, 9]" data-slider-ticks-labels="[11, 12, 13, 21, 22, 23,31,32,33]" data-slider-ticks-snap-bounds="60"/> Before clicking selection_140 After clicking selection_141 I use bootstrap 3.3.7

fturiot commented 7 years ago

yes but i would like display correctly directly without click i'm sure one solution exist for force this but i not found

fturiot commented 7 years ago

the problem that slider-tick-label have style width 0px before click

`<div class="slider-tick-label" style="width: 0px;">100%

`

fturiot commented 7 years ago

ok solve for me angularjs $timeout must be use . But one point to solve : how keep color when disable ? thanks

fturiot commented 7 years ago

all solve thanks

sainagendra commented 6 years ago

where exactly you use timeout

prphntm63 commented 5 years ago

This may be because you are using tab or panel navigation with bootstrap, which sets 'hidden' panes by display:none which does not allow the slider to render on a hidden pane.

This solution seems to work for me:

https://stackoverflow.com/questions/17206631/why-are-bootstrap-tabs-displaying-tab-pane-divs-with-incorrect-widths-when-using