basti1012.bplaced.net

ich habe einen Counter auf meiner Webseite integriert. Jetzt wäre es super, wenn dieser einmalig aktiviert wird und zwar erst dann, wenn die jeweilige Position erreicht ist. Folgenden Code habe ich dafür verwendet (Quelle stackoverflow) Das scheint beinahe zu funktionieren. Leider wird das Script immer aktiviert, sobald gescrollt wird. Danke schon einmal!

Code

                                    
                                <style>
  div{
  height:100px;
  width:100px;
  font-size:50px;
  text-align:center;
  border:1px solid black;
  margin:0 auto;
}
div:hover{
  background:lightgreen
}
</style>
<h1>Hover die Boxen</h1>
<h3>Ohne Helfer Variable</h3>

<div id="box1"></div>
<h3>Mit helfer Variable</h3>
  <div id="box2"></div>
<script>
  var timer;
bo1=document.getElementById('box1');
  bo1.addEventListener('mouseover',function(){
  g=0;
  clearInterval(timer);
  timer=setInterval(function(){
    g++;
    bo1.innerHTML=g;
  },100)
})
//    mit helfer Variable
helfer='true';
bo2=document.getElementById('box2');
bo2.addEventListener('mouseover',function(){
  if(helfer=='true'){
    c=0;
    setInterval(function(){
      c++;
      bo2.innerHTML=c;
    },100)
    helfer=false;
  }
})
</script>