Reports

@Timbukto :- With minor change in your code, you can easily achieve your expected result:

Add a common class to your html DIVs as shown below:

<div class="box">
    <div id="slider1"></div>
    <div class="slider_div div1"></div>
    <div class="slider_div  div2"></div>
    <div class="slider_div div3"></div>
    <div class="slider_div div4"></div>
    <div class="slider_div div5"></div>
</div>

and now change the js script as shown below:

       $("#slider1").slider({
            range: "min",
            min: 0,
            max: 5,
            value: 0,
            slide: function (event, ui) {
                $(".slider_div").hide();   // it will hide any of the active div
                $(".div" + ui.value).show();
                
            }
        });

So, for JS script, first hide the active/displayed div and then show the div which is needed to show.

79256921