I have a value that emits an incrementing decimal value on scroll from 0 to 1.
Currently the script triggers the change of image on scroll as a scroll will cause the value to increment and the image will only change back once the value returns to 0.
I need a check that actively checks if the value is increasing and if the value stops increasing it should return to the idle image.
'
<script type="text/javascript">
var Character = document.getElementById("character");
(function($) {
$.jInvertScroll(['.scroll'],
{
height: 6000,
onScroll: function(percent) {
console.log(percent);
if (percent++) {
Character.style.backgroundImage = "url(/examples/images/gif/sqeekiWalk.gif)";
} else {
Character.style.backgroundImage = "url(/examples/images/gif/sqeekiIdle.gif)"
}
}
});
}(jQuery));
</script>
'