Как использовать линейный индикатор выполнения Materialize в качестве предварительного загрузчика страниц?

Question

Я использую Materialise Framework в личном проекте, и я хочу создать индикатор загрузки, используя не круговую диаграмму, а линейный индикатор выполнения и его анимацию.

ПРОБЛЕМА

Пока круговая анимация работает должным образом во время загрузки экрана, линейная неопределенная строка прогресса не работает до полной загрузки страницы.

У меня был короткий просмотр в файле материализации. js, но я не нашел ничего, связанного с тем, что индикатор выполнения "активируется", только когда страница полностью загружена , Есть ли способ изменить это?

Заранее спасибо!

Answer 1

Предзагрузчики с круговой и линейной неопределенностью не имеют каких-либо логик c, к которым они прикреплены - они просто анимируются, зацикливаются, навсегда. Разработчик должен показывать и скрывать по мере необходимости.

Вот пример того, как вы можете использовать их в ajax вызове - показать, когда вызов инициирован, а затем скрыться при успехе:

function ajax_function() {

    $('.preloader-wrapper').removeClass('hide');

    $.ajax({

        url : '.../wp-admin/admin-ajax.php',
        type : 'post',
        data : {
            data: mydata

        },
        error : function( response ){      
            // Handle error
        },
        success : function( response ){

            if( response == 0 ) {

                // Handle no response

            } else {                    

                $('.mydiv').append( response );
                $('.preloader-wrapper').addClass('hide');


            }

        }

    })
}