Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770
Форумы портала PHP.SU :: Версия для печати :: GIF-файл отображается без анимации
Форумы портала PHP.SU » Клиентская разработка » HTML, Дизайн & CSS » GIF-файл отображается без анимации

Страниц (1): [1]
 

1. XelaNimed - 25 Февраля, 2010 - 13:35:31 - перейти к сообщению
Всем доброго и продуктивного времени суток.
Проблема в следующем... Имеется изображение (GIF), которое должно отображаться при ожидании ответа от сервера. Запрос делается с помощью HttpRequest.
Вот часть кода, где находится само изображение(div в dive):
CODE (htmlphp):
скопировать код в буфер обмена
  1.  
  2. <div style="onclick="autosuggest();spoiler_toggle(this);" onmouseover="div(\''.$key.'\');">
  3.         </div>
  4.  
  5. <div style="display: none;" onmouseover="div(\''.$key.'\');">
  6.         <img src="img/ajaxloader.gif" name="gifloader'.$key.'" id="gifloader'.$key.'" />
  7.         <div  name="'.$key.'" id="'.$key.'"></div>
  8. </div>

При клике на "спойлере" осуществляется запрос к бд и полученый результат выводится в див, которы при этом меняет свое состояние с "none" на "block", т.е. становится видимым.
При небольшом количестве совпадений\строк, все происходит достаточно быстро, но если их число превышает 200-300, то задержка порядка 1,5-2 секунд происходит. Было решено отображать для пользователя анимированный GIF, который бы извещал, что запрос в процессе. Привожу часть кода, которая, собственно, и отображает скрытый див:
CODE (htmlphp):
скопировать код в буфер обмена
  1. function autosuggest() {
  2. var q = document.getElementById('divid').value;
  3. var orderby = document.getElementById('jsorderby').value;
  4. var jsasc = document.getElementById('jsasc').value;
  5. // Set te random number to add to URL request
  6. nocache = Math.random();
  7. http.open('post', 'advanced_search_ajax.php?q='+q+'&orderby='+orderby+'&jsasc='+jsasc+'&nocache = '+nocache);
  8. http.onreadystatechange = autosuggestReply;
  9. http.send(null);
  10. }
  11. function autosuggestReply() {
  12.         if(http.readyState == 4){
  13.                 var response = http.responseText;
  14.                 var d = document.getElementById('divid').value;
  15.                 var gif = 'gifloader'+document.getElementById('divid').value;
  16.                 var e = document.getElementById(d);
  17.                 if(response!=""){
  18.                         document.getElementById(gif).style.display="none";
  19.                         e.innerHTML=response;
  20.                         e.style.display="block";
  21.                 } else {
  22.                         e.style.display="none";
  23.                         document.getElementById(gif).style.display="block";
  24.                 }
  25.         }
  26. }

Собственно проблема: все отображается, но без анимации. И также при закрытии дива и повторном открытии, GIF уже не отображается. Я понимаю, что под РНР это в какой-то степени не подходит, но кажется мне, что проблема именно в HttpRequeste, что-то не учтено, что именно без понятия.
P.S.: в принципе задача стоит отобразить картинку ожидания ответа от сервера и где она будет находиться - в самом диве или по центру страницы поверх всех других не принципиально. Просто не нашел, как отобразить див по центру страницы поверх всего остального. Может быть знающие люди подскажут?!
P.P.S.: если материал не соотвествует тематике ветки,то в таком случае приношу свои извинения.
2. Champion - 25 Февраля, 2010 - 13:45:02 - перейти к сообщению
XelaNimed пишет:
отобразить див по центру страницы поверх всего остального.
position: absolute; z-index: 99; top: xx; left: xx

А картинка правда анимированная? Если ее открыть просто одну только ее в адресной строке набрать - будет шевелиться?
Во всех браузерах анимация пропадает?
3. XelaNimed - 25 Февраля, 2010 - 14:01:40 - перейти к сообщению
Да, анимированная.
4. JustUserR - 25 Февраля, 2010 - 14:32:30 - перейти к сообщению
XelaNimed Вероятно проблема в том что AJAX-запрос занимает весь канал в вашем браузере и анимация картинки не скачивается - попробуйте сделать предзагрузку данной картинки в основной статический документ - например с помощью new Image

 

Powered by ExBB FM 1.0 RC1