'javascript - schedule with tabs

I created I javascript schedule thermostat for a enteire week and work. But now I have some problems with tabs, because when I move a period, moving on slider, I have graphics problem.

I add the code on jsfiddle, because so it's more simple to understand and see the code working.

Here have a code HTML:

<div class="container-fluid">
<div class="col-lg-6 col-md-8">
    <ul class="nav nav-pills">
        <li>
            <a data-toggle="pill" href="#tabs-1">Zone 1</a>
        </li>
        <li>
            <a data-toggle="pill" href="#tabs-2">Zone 2</a>
        </li>
        <li>
            <a data-toggle="pill" href="#tabs-3">Zone 3</a>
        </li>
        <li>
            <a data-toggle="pill" href="#tabs-4">Zone 4</a>
        </li>
    </ul>
    <div class="tab-content">
        <div class="tab-pane fade in active" id="tabs-1">
            <div class="slider-label">Mon</div>
            <div class="slider" day="mon" zone="1"></div>
            <div class="slider-label">Tue</div>
            <div class="slider" day="tue" zone="1"></div>
            <div class="slider-label">Wed</div>
            <div class="slider" day="wed" zone="1"></div>
            <div class="slider-label">Thu</div>
            <div class="slider" day="thu" zone="1"></div>
            <div class="slider-label">Fri</div>
            <div class="slider" day="fri" zone="1"></div>
            <div class="slider-label">Sat</div>
            <div class="slider" day="sat" zone="1"></div>
            <div class="slider-label">Sun</div>
            <div class="slider" day="sun" zone="1"></div>
        </div>
        <div class="tab-pane fade in" id="tabs-2">
            <div class="slider-label">Mon</div>
            <div class="slider" day="mon" zone="2"></div>
            <div class="slider-label">Tue</div>
            <div class="slider" day="tue" zone="2"></div>
            <div class="slider-label">Wed</div>
            <div class="slider" day="wed" zone="2"></div>
            <div class="slider-label">Thu</div>
            <div class="slider" day="thu" zone="2"></div>
            <div class="slider-label">Fri</div>
            <div class="slider" day="fri" zone="2"></div>
            <div class="slider-label">Sat</div>
            <div class="slider" day="sat" zone="2"></div>
            <div class="slider-label">Sun</div>
            <div class="slider" day="sun" zone="2"></div>
        </div>
        <div class="tab-pane fade in" id="tabs-3">
            <div class="slider-label">Mon</div>
            <div class="slider" day="mon" zone="3"></div>
            <div class="slider-label">Tue</div>
            <div class="slider" day="tue" zone="3"></div>
            <div class="slider-label">Wed</div>
            <div class="slider" day="wed" zone="3"></div>
            <div class="slider-label">Thu</div>
            <div class="slider" day="thu" zone="3"></div>
            <div class="slider-label">Fri</div>
            <div class="slider" day="fri" zone="3"></div>
            <div class="slider-label">Sat</div>
            <div class="slider" day="sat" zone="3"></div>
            <div class="slider-label">Sun</div>
            <div class="slider" day="sun" zone="3"></div>
        </div>
        <div class="tab-pane fade in" id="tabs-4">
            <div class="slider-label">Mon</div>
            <div class="slider" day="mon" zone="4"></div>
            <div class="slider-label">Tue</div>
            <div class="slider" day="tue" zone="4"></div>
            <div class="slider-label">Wed</div>
            <div class="slider" day="wed" zone="4"></div>
            <div class="slider-label">Thu</div>
            <div class="slider" day="thu" zone="4"></div>
            <div class="slider-label">Fri</div>
            <div class="slider" day="fri" zone="4"></div>
            <div class="slider-label">Sat</div>
            <div class="slider" day="sat" zone="4"></div>
            <div class="slider-label">Sun</div>
            <div class="slider" day="sun" zone="4"></div>
        </div>
    </div>
</div>

Code complete with also javascript is present on jsfiddle.

Thank you

https://jsfiddle.net/k25nbbrp/

screenshot 👇
enter image description here



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source