JQuery Range Slider Показать и скрыть Div ⇐ Jquery

[Anonymous]

Я пытаюсь показать () и скрыть () элементы Div, но этот способ работает только вперед, а не назад.
Я пытаюсь изменить элемент Div с помощью ползунка диапазона и СКРЫТЬ любой другой Div. Я попробовал ui.value минус 1 Hide(), но это не сработало.
Поэтому мой вопрос: как изменить DIV с помощью ползунка диапазона вперед и назад?

Код: Выделить всё

$(function() {
$("#slider1").slider({
range: "min",
min: 0,
max: 5,
value: 0,
slide: function(event, ui) {
$(".div" + ui.value).show();
$(".div" + ui.value - 1).hide();
}
});
});

Код: Выделить всё

body {
background-color: #6A6A6A;
}

html,
body {
height: 100%;
}

.box {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}

#slider1 {
position: absolute;
top: 25px;
left: 1%;
height: 6vh;
width: 175px;
z-index: 9999;
}

.ui-slider .ui-slider-horizontal {
height: .6em;
}

.ui-slider .ui-slider-handle {
position: absolute;
z-index: 2;
width: 25px !important;
height: 10vh !important;
cursor: default;
}

.div1,
.div2,
.div3,
.div4,
.div5 {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: none;
}

.div1 {
background-color: #16168f;
}

.div2 {
background-color: #268226;
}

.div3 {
background-color: #ffbb00;
}

.div4 {
background-color: #565656;
}

.div5 {
background-color: #66668f;
}

Код: Выделить всё

Подробнее здесь: https://stackoverflow.com/questions/792 ... d-hide-div