Я хочу отображать анимацию загрузки, пока моя страница загружается, и когда загрузка завершена, а затем явно скрыть ее.Загрузка загрузки страницы
Я работаю в ASP.NET с использованием Masterpages, просто интересно, есть ли простой способ сделать это с помощью JQuery?
Любые указатели будут оценены по достоинству.
Благодаря
Просто поместите изображение с анимированным GIF на этой странице. Дайте ему идентификатор loadingImage и добавьте следующий скрипт:
$(document).ready(function(){
$('#loadingImage').hide();
});
Кстати, как долго ваша страница принимая загрузки? Использует ли AJAX вызовы для загрузки данных? Возможно, вы должны изучить это и в обработчике обратного вызова, вызвать функцию hide() на вашем изображении.
Рассмотрите возможность использования UpdateProgress управления
Если оба ответа выше были на правильных строках, я мог бы сделать либо то, что мне было нужно в моем сценарии.
Однако я нашел следующее сообщение о том, что на SO, который предоставил мне решение, которое я получил.
Colorbox: Show/simulate 'loading' animation for iframe content?
Спасибо всем за ваш вклад.
Я сделал анимацию таким образом на моей главной странице:
<div id="loading" style="text-align: center" hidden><asp:Image ID="loadingImage" runat="server" ImageUrl="~/Images/loading.gif" /></div>
, а затем я использовал JQuery таким образом
<script>
function showLoading() {
$("#loading").show();
}
var loadingTimeout = setTimeout(showLoading, 3000);
$(document).ready(function() {
clearTimeout(loadingTimeout); //make sure loader doesn't appear if page loads in less than 3 seconds
$("#loading").hide();
});
</script>
Я надеюсь, что это поможет.
Так просто и интересно, есть ли какой-либо путь, пока вся страница не загружена полностью, страница будет отключена? – Mostafa
Привет @Mostafa, если вы хотите отключить скрипты на своей странице до загрузки, $ (document) .ready (function ...) - это место для их инициализации. Если вы хотите сделать больше, отправьте вопрос с более подробной информацией. –
На загрузку загружается около 5 секунд, но в моем сценарии она загружается в отдельный кадр, поэтому я хочу получить обратную связь с пользователем, так как иначе вы нажимаете на ссылку, и ничего не происходит. Я пробовал ваш пример кода, но все, кажется, происходит сразу, а не появляется загружаемый div, а затем исчезает при загрузке основного содержимого. Я предполагаю, что более сложное решение требуется с помощью какого-то обработчика. Я использую APP.NET AJAX, если с этим можно что-то сделать. – bigtv