Configuré una ul de variantes de productos con desplazamiento horizontal. Cuando me desplazo y hago clic en una variante, la página se actualiza y el desplazamiento vuelve a comenzar. Necesito mantener la posición en la que se actualizó primero para ver la variante en la que se hizo clic.
ul#group_17 { width: 150px; display: flex; overflow: auto; list-style: none; } li {margin: 0 10px 0 0} .input-color { position: absolute; opacity: 0; cursor: pointer; height: 60px; width: 60px; } span { height: 60px; width: 60px; display: block; } <ul id="group_17"> <li class="float-xs-left input-container"> <label> <input class="input-color" type="radio" data-product-attribute="17" name="group[17]" value="87"> <span class="color texture" style="background:black"></span> </label> </li> <li class="float-xs-left input-container"> <label> <input class="input-color" type="radio" data-product-attribute="17" name="group[17]" value="88" checked="checked"> <span class="color texture" style="background:brown;"></span> </label> </li> <li class="float-xs-left input-container"> <label> <input class="input-color" type="radio" data-product-attribute="17" name="group[17]" value="89"> <span class="color texture" style="background:red"></span> </label> </li> <li class="float-xs-left input-container"> <label> <input class="input-color" type="radio" data-product-attribute="17" name="group[17]" value="90"> <span class="color texture" style="background:yellow"></span> </label> </li> </ul>¿Como lo puedo hacer?