Estoy migrando un fragmento de código que tengo en jquery. Es el siguiente:
$(window).scroll(function() {
var ele = document.getElementById('holamundo');
if(esVisible(ele)== true){
$('.counter').each(function() {
var $this = $(this),
countTo = $this.attr('data-count');
$({ countNum: $this.text()}).animate({
countNum: countTo
},
{
duration: 2000,
easing:'linear',
step: function() {
$this.text(Math.floor(this.countNum));
},
complete: function() {
$this.text(this.countNum);
}
});
});
}else{
}
});
function esVisible(elem){
var posTopView = $(window).scrollTop();
var posButView = posTopView + $(window).height();
var elemTop = $(elem).offset().top;
var elemBottom = elemTop + $(elem).outerHeight();
return ((elemBottom < posButView && elemBottom > posTopView) || (elemTop >posTopView && elemTop< posButView));
}
Hasta el momento he logrado pasar lo siguiente:
window.onscroll = function() {
const ele = document.getElementById('holamundo');
if(esVisible(ele)== true){
document.getElementsByClassName('counter').foreach( function(element){
countTo = element.getAttribute('data-count');
});
}else{
}
};
pero me arroja un error en foreach:
uncaught TypeError: document.getElementsByClassName(...).forEach is not a function
Hasta el momento esto me causa conflicto.