Есть функция, которая запускается при прокрутке страницы до определенного места.(к примеру до (top>800
)
Если мы прокрутим страницу обратно ((top<800
), то функция продолжит выполняться, пока не завершиться полностью.
Вопрос: Как сделать так, чтобы выполнение функции остановилось, если условие перестало выполняться? выглядит это все примерно так:
function add() {
$("ul li").each(function(i, el) {
setTimeout(function() {
$(el).addClass("active");
}, 0 + (i * 800));
});
}
function remove() {
$("ul li").each(function(i, el) {
$(el).removeClass("active");
});
}
$(window).scroll(function() {
var top = $(window).scrollTop();
if (top > 300) {
add();
} else {
remove()
}
})
body {
height: 2800px;
}
ul {
display: block;
position: fixed;
}
li {
background: #FF9800;
margin: 2px;
display: inline-block;
padding: 5px;
color: #fff;
}
li.active {
background: #8BC34A;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
</ul>
else
значит addcl - не запущена и прерывать нечего