JAVASCRIPT в моей функции window.onscroll работает только первая функция - PullRequest
Новая
       39

JAVASCRIPT в моей функции window.onscroll работает только первая функция

0 голосов
/ 01 августа 2020

Я новичок в javascript и пытаюсь заставить обе эти функции работать в разное время в зависимости от позиции прокрутки, но работает только первая функция myFunction1. Пожалуйста, помогите. 

<script>
 

window.onscroll = function redblob() {myFunction()

function myFunction() {
  if (document.body.scrollTop > 250 && document.body.scrollTop < 1200 || 
  document.documentElement.scrollTop > 250  && document.documentElement.scrollTop < 1200  ) {
    document.getElementById("redblob").classList.add('scale-transition');
  } 

 
  else {
    document.getElementById("redblob").classList.remove('scale-transition');
  }
  
  
}

function myFunction2() {
  if (document.body.scrollTop > 1200 && document.body.scrollTop < 1700 || 
  document.documentElement.scrollTop > 1200  && document.documentElement.scrollTop < 1700  ) {
    document.getElementById("blueblob").classList.add('scale-transition');
 
  } 

 
  else {
    document.getElementById("blueblob").classList.remove('scale-transition');
 
  }
  
  
}
};
  
</script>

Ответы [ 2 ]

0 голосов
/ 01 августа 2020

Спасибо за вашу помощь, Даниэль, как вы заметили, я повторно использовал имя функции myFunction. Я изменил имя на function1 и добавил его к первой функции, и она отлично работала. 

window.onscroll = function functionname() { myFunction2(); myFunction1(); 

function myFunction1() {
  if (document.body.scrollTop > 250 && document.body.scrollTop < 1200 || 
  document.documentElement.scrollTop > 250  && document.documentElement.scrollTop < 1200  ) {
    document.getElementById("redblob").classList.add('scale-transition');

  } 

 
  else {
    document.getElementById("redblob").classList.remove('scale-transition');

  }
  
  
}

function myFunction2() {
  if (document.body.scrollTop > 1200 && document.body.scrollTop < 1700 || 
  document.documentElement.scrollTop > 1200  && document.documentElement.scrollTop < 1700  ) {
    document.getElementById("blueblob").classList.add('scale-transition');

  } 

 
  else {
    document.getElementById("blueblob").classList.remove('scale-transition');

  }
  
  
}
};
0 голосов
/ 01 августа 2020

Вы повторно использовали имя функции myFunction (). Я переименовал вторую в myFunction1 () (это то, что вы сказали, она должна быть названа в вашем вопросе) и добавил перед ней объявление функции. Это привело к удалению ошибок go. 

<script>
 
window.onscroll = function redblob() {
    function myFunction() {
        function myFunction1() {
            if ((document.body.scrollTop > 250) && (document.body.scrollTop < 1200) || (document.documentElement.scrollTop > 250) && (document.documentElement.scrollTop < 1200)) {
                document.getElementById("redblob").classList.add('scale-transition');
            } else {
                document.getElementById("redblob").classList.remove('scale-transition');
            }
        }

        function myFunction2() {
            if (document.body.scrollTop > 1200 && document.body.scrollTop < 1700 || document.documentElement.scrollTop > 1200 && document.documentElement.scrollTop < 1700) {
                document.getElementById("blueblob").classList.add('scale-transition');
            } else {
                document.getElementById("blueblob").classList.remove('scale-transition');
            }
        }
    }
}

</script>
...