Tengo un div
que se puede arrastrar sólo hacia arriba y hacia abajo, pero deseo que tenga un mínimo a 250px y máximo a 650px, ya he buscando pero aún no he podido encontrar una solución.
Aquí podrán probar el código que llevo hasta el momento.
var offset = [0];
var divOverlay = document.querySelector(".panel__bottom-xs");
var isDown = false;
divOverlay.addEventListener('mousedown', function(e) {
isDown = true;
offset = [
divOverlay.offsetTop - e.clientY
];
}, true);
document.addEventListener('mouseup', function() {
isDown = false;
}, true);
document.addEventListener('mousemove', function(e) {
event.preventDefault();
if (isDown) {
divOverlay.style.top = (e.clientY + offset[0]) + 'px';
document.querySelector('span').innerHTML = divOverlay.style.top }
}, true);
.panel__bottom-xs {
position: fixed;
bottom: 0px;
background: red;
height: 50px;
width: 50px;
left: 150px;
}
<div class="panel__bottom-xs"></div>
<span></span>
De antemano muchas gracias por su ayuda!