Есть ли способ показать загрузочное изображение (например, ajax loading gif), когда я загружаю большой контент обычным запросом?

Есть ли способ показать загрузочное изображение (например, ajax loading gif), когда я загружаю большой контент обычным запросом?

У меня нет запроса ajax, но есть простая обратная передача asp.net. И у меня есть большой сайт с сотнями или тысячами элементов. Из-за этого странице нужно, скажем, 4-10 секунд, пока она полностью не загрузится, и, следовательно, страница является белой страницей, и пока она не будет отображена, ни один элемент не отображается. Может быть, отображаются некоторые элементы, но браузер все еще рендерится.

Есть ли шанс без использования ajax и т. Д. Показать загрузочное изображение? Интернет-исследователь предпочел.

http://www.kuka-robotics.com/res/icn/ajax_loader.gif

Источник

2 ответа

Добавьте этот скрипт в ваш код и вызовите функцию init() при загрузке тега body.

   <script type="text/javascript">
     var ld=(document.all);
      var ns4=document.layers;
     var ns6=document.getElementById&&!document.all;
     var ie4=document.all;
      if (ns4)
        ld=document.loading;
     else if (ns6)
        ld=document.getElementById("loading").style;
     else if (ie4)
        ld=document.all.loading.style;
      function init()
     {
     if(ns4){ld.visibility="hidden";}
     else if (ns6||ie4) ld.display="none";
     }
     </script>

И загрузка тела тега вызова Init();

<body style="background-color:#FFFFFF;" onLoad="init()">
<div id="loading" style="position:absolute; width:200px; height:163px; text-align:center;top:310px; left:487px;">
<img src="load.gif" border=0 /></div>

....

..
</body>

Дайте мне знать, это работает для вас или нет.

Всего наилучшего.

Источник

Вы можете создать два контейнера:

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

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

Например:

<div id="loading_container">
     <img src="http://www.kuka-robotics.com/res/icn/ajax_loader.gif" />
</div>
<div id="main_container" style="display:none">
     <!-- your content here -->
</div>
<script type="text/javascript">
      window.onload=function(){
         document.getElementById("loading_container").style.display = 'none';
         document.getElementById("main_container").style.display = 'block';
      };
</script>
Источник
Другие вопросы по тегам