Crear un sitio web con un temporizador que cuenta una vez que el div se desplaza a la vista. El problema que tengo es que al desplazarme se inicia el temporizador nuevamente, y me gustaría que el valor final que alcanza el temporizador permanezca hasta que se vuelva a cargar la página.
Intenté usar 'event.handled' y '$.Callbacks("once")' pero ninguno parece funcionar.
Se agradecería cualquier orientación: ¡codifique a continuación!
$(allInView); $(window).scroll(allInView); function isScrolledIntoView(elem) { var docViewTop = $(window).scrollTop(); var docViewBottom = docViewTop + $(window).height(); var elemTop = $(elem).offset().top; var elemBottom = elemTop + $(elem).height(); return elemBottom <= docViewBottom && elemTop >= docViewTop; } function allInView() { if (isScrolledIntoView($("#column4"))) { /// when 'column4' IS being 'viewed', the timers then begin jQuery(function ($) { $(".timer").countTo({ from: 0, to: 183, speed: 1000, refreshInterval: 50, onComplete: function (value) { console.debug(this); }, }); }); } }Podría usar una variable para verificar si el temporizador ya se inició.
let lockTimer = false; function allInView () { // Exits conditions to avoid to restart the timer if (lockTimer || !isScrolledIntoView(...)) { return; } lockTimer = true; // block timer launch JQuery(...); }