Здравствуйте. По событию mousedown срабатывает функция func, которая считает mouseX scroll. Так вот, по событию $(document).on('mouseup') эта функция func должна должна останавливаться, но я не могу придумать как это сделать Поможете? Заранее благодарен за ответ!
$(document).ready(function(){
var interval = null;
var dist = 0;
$('.pod').on('mousedown', function(e) {
var begin = 0;
begin = e.pageX;
$(document).on('mousemove', function func(ee) {
dist = (ee.pageX - begin >= -5) && (ee.pageX - begin < 200) ? ee.pageX - begin : false;
})
if ( interval != null ) clearInterval(interval);
//Устанавливаем интервал
clearInterval(interval);
interval = setInterval(function() {
$('.pod').css('transform','translateX('+ dist + 'px' + ')')
interval = null;
},10)
})
//Очищаем интервал
$(document).on('mouseup',function(){
clearInterval(interval);
interval = null
//ЗДЕСЬ НУЖНО ОСТАНОВИТЬ ФУНКЦИЮ func!
})
$('.pod').on('mouseout',function(){
clearInterval(interval);
interval = null
//ЗДЕСЬ НУЖНО ОСТАНОВИТЬ ФУНКЦИЮ func!
})
})
И html + css для наглядности:
<div class="nad">
<div class="pod"></div>
</div>
.nad {
width: 200px;
height: 3px;
border: 1px solid #ccc;
border-radius: 50px;
margin-top: 100px;
margin-left: 100px;
position: relative;
}
.pod {
width: 25px;
height: 25px;
box-shadow: 0 0 5px 0 black;
border-radius: 50px;
position: absolute;
left: 0;
top: -10px;
z-index: 999;
background: white;
}
