Показывать Preloader во время выполнения функции JavaScript

Question

Мне нужно показывать прелоудер, пока выполняется определенная функция на JS. Показывать его нужно вместо основного контента. Помогите, пожалуйста, я не работаю с JS. Таких страниц у меня будет много, где нужно будет реализовать лоудер, может быть вы подскажете универсальный вариант, который можно будет легко прикрутить к разным страницам. Спасибо заранее всем

<div id="preloader"></div>
<div class="card">
    //основной контент, который нужно скрывать во время работы лоудера
</div>

<script type="text/javascript">

    function uploadFile(upload) {
    //функция, во время выполнения которой нужно крутить лоудер
    }

</script>

Answer 1

Прикольная штука для такого calback function

<div id="preloader"></div>
<div class="card">
    //основной контент, который нужно скрывать во время работы лоудера
</div>

<script type="text/javascript">

    function uploadFile(upload) {
    //функция, во время выполнения которой нужно крутить лоудер
    
      return;
    }
    
    function preloader_calback(calback) {
      document.querySelector('#preloader').classList.add('active')
      calback();
      document.querySelector('#preloader').classList.remove('active')
    }
    
    //Теперь запускать можно так 
    //preloader_calback(uploadFile);

</script>

БЛОГ НА HUSL

Показывать Preloader во время выполнения функции JavaScript

Ответы (1 шт):