Все технические форумы на одном сайте Удобный поиск информации с популярных форумов в одном месте
Вопрос: выполнение функции после полной загрузки страницы

Привет всем.
Необходимо выполнить следующую задачу:
Нужно чтобы после ПОЛНОЙ загрузки страницы (сам html, картинки) выполнялась функция.

Как это можно реализовать?
Ответ: У меня похожая проблема. На странице есть <object>...</object>, в который подгружается pdf-ка. Я хочу использовать функцию
window.onload=function(){
/* ваш код */
}
чтоб в тулбаре принудительно вызвать click на кнопке Toggle SideBar
Но получается так, что window.onload срабатывает еще до того, как загружаются элементы этого тулбара.
Может кто сталкивался с подобным - подскажите, пожалуйста как быть :-)
Вопрос: Полная загрузка изображений

Здравствуйте!
Есть скрипт который запускает функцию после полной загрузки изображений. Изображениям присвоен атрибут hidden, но несмотря на это IE все равно отображает изображения на 1-1,5 секунды.
Помогите реализовать только на js без прописывания изображений в HTML. Заранее спасибо!

<img id="logo_img_1" src="img/logo/1.png" hidden/>
<img id="logo_img_2" src="img/logo/2.png" hidden/>
<img id="logo_img_3" src="img/logo/3.png" hidden/>
<img id="logo_img_4" src="img/logo/4.png" hidden/>
<img id="logo_img_5" src="img/logo/5.png" hidden/>


window.onload = function preload() {
logo_animation() + document.getElementById("logo_img_1").complete + document.getElementById("logo_img_2").complete + document.getElementById("logo_img_3").complete + document.getElementById("logo_img_4").complete + document.getElementById("logo_img_5").complete;
}
Ответ: K_PECT,
<!DOCTYPE HTML>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .gallery img{
    display: none;
    width: 150px;
    height: 100px;
  }
  .gallery.show img{
    display:  inline-block;
  }

  </style>
  <script>
  	window.onload = function () {
  	  var gallery = document.querySelector('.gallery')
  	  var imgs = gallery.querySelectorAll('.gallery img');
  	  var arr_src =['http://www.anypics.ru/pic/201302/1366x768/anypics.ru-59453.jpg',
  	    'http://www.wall-papers.ru/main.php?g2_view=core.DownloadItem&g2_itemId=38417&g2_serialNumber=3',
  	    'http://w7t.ru/zooms/7da1/7/6168262b44.jpg',
  	    'http://imgs.mi9.com/uploads/cartoon/4834/disney-cartoon-wallpaper_1366x768_88837.jpg',
  	    'http://biskvitka.net/uploads/posts/2011-05/thumbs/1306582219_12.jpg'];
  	  var callback = function ()
  	  {
  	    gallery.classList.add('show')
  	  };
  	  for (var i = 0, len = imgs.length; i < imgs.length; i++) {
  	    var img = document.createElement('img');
  	    img.onload = img.onerror = (function (a)
  	      {
  	        return function (event) {
  	          imgs[a].src = event && event.type == 'load'? this.src: 'data:image/jpg;base64,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'; //ссылка на фото отстутствует
  	        }
  	      }
  	    )(i);
  	    imgs[i].onload = function ()
  	    {
  	      !--len && callback()
  	    };
  	    img.src = arr_src[i];
  	    img.complete && img.onload()
  	  }
  	}
  </script>
</head>

<body>
<div class="gallery">
<img src="" alt=""  />
<img src="" alt="" />
<img src="" alt="" />
<img src="" alt="" />
<img src="" alt="" />
</div>
</body>
</html>
Вопрос: красивый переход, часики и загрузка больших страниц

как сделать HoursGlass (или всякие вращающиеся точки) пока открывается HTML страница.

есть большие страницы с долгой загрузкой с сервера, секунд 20.
так вот как сделать?
например, щелкаю ссылку на странице 1 и сразу появляются часики, и они исчезают только после полной загрузки страницы 2.

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

сп.
Ответ: yemets63,

ищем css preloader(какой понравится) Добавляет на страницу

при начале загрузки делаем видимым при окончании прячем!

Вот так както
Вопрос: Как скрыть содержимое div до полной загрузки сайта?

Как скрыть определенный div до полной загрузки сайта?

Нужно чтобы определенная часть (кусок) HTML содержимого не отображался до того как загрузка не прекратится..
Ответ: Georgian,
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  div.hide{
    display: none;
  }

  </style>
</head>

<body>
<div class="hide">test</div><img src="http://oboi-klas.ru/_nw/0/46976278.jpg" alt="">
 <script>
     window.onload = function() {
        var div = document.querySelector('.hide');
        div && div.classList.remove('hide')
         };
 </script>
</body>

</html>
Вопрос: При полной загрузке страницы пропадает форма ввода комментариев

Есть два сайта работают на одном шаблоне, на одном сайте есть поле для ввода на втором нет поля для ввода комментариев.
Точнее оно есть,появляется на долю секунды а при полной загрузке страницы пропадает.
вот сам сайт
Ответ: oleg_coma, консоль выдает ошибку Uncaught Error: VK not initialized. Please use VK.init
Вопрос: Почему не видно текста JavaScript скрипта после динамической загрузки?

Доработал пример динамической загрузки JavaScript вот отсюда:



Получил такой код:

Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="ru">
<head>

<script type="text/javascript">

var scriptData;

function loadError (oError) {
  throw new URIError("The script " + oError.target.src + " is not accessible.");
}


function onLoadScript () {
  console.log("Script info after load");
  console.log(scriptData.src);
  console.log(scriptData.text);
  
  alert("You read this alert because the script has been correctly loaded.");
}


function importScript (sSrc, fOnload) {

  var oScript = document.createElement("script");
  oScript.type = "text\/javascript";
  oScript.onerror = loadError;
  
  if (fOnload) { 
    oScript.onload = fOnload; 
  }
  
  document.currentScript.parentNode.insertBefore(oScript, document.currentScript);
  oScript.src = sSrc;
  
  console.log("Script info");
  console.log(oScript.src);
  console.log(oScript.text);
  
  return oScript;
}


scriptData=importScript("http://www.google-analytics.com/ga.js", onLoadScript);
    

</script>

</head>
<body>
Hello!
</body>
</html>
В логе браузера вижу следующий вывод:

Код:
"Script info"
"http://www.google-analytics.com/ga.js"
""
"Script load success"
"Script info after load"
"http://www.google-analytics.com/ga.js"
""
Вопрос. Почему не выдается текст скрипта объекта HTMLScriptElement (свойство text равно "") даже после успешной загрузки?
Ответ: Получить текст из скрипта загруженного по url насколько я знаю невозможно.

<script type="text/javascript" src="http://www.google-analytics.com/ga.js"></script> - тут нет никакого текста внутри тега, так что DOM свойства типа text и innerHTML вернут нам "ничего".

Я посмотрел скрипт через console.dir там ни в одном из свойств не было текста скрипта
Вопрос: Загрузка картинок с сервера YouTube; нет доступа к содержимому файла Bitmap, BitmapData

Всем привет!
Расширяю функционал своего плеера для воспроизведения видеороликов с YouTube. Потребовалось реализовать
функцию "Похожее видео".
Возникла проблема с манипулированием данных загруженных графических файлов с сервера YouTube.
Исходный код для загрузки файла, который позволяет вывести графику на экран, а также должен предоставлять доступ к свойству content у объекта Loader:
ActionScript 3
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
// Ссылка на объект с растровым изображением
var bm:Bitmap;
public function main() {
    // Адрес расположения графического файла
    var uri:String = "https://i.ytimg.com/vi/wUGdtcE3xwg/hqdefault.jpg";
    // Объект для работы с протоколом http
    var url:URLRequest = new URLRequest(uri);
        /*Правило из документации Adobe : Если используется метод Loader.load(), задайте свойство checkPolicyFile параметра context, который является объектом LoaderContext. */
    // Оъект управления контекстом безопасности
    var context:LoaderContext = new LoaderContext();
    // Явное использование файла политики безопасности  
    context.checkPolicyFile = true; 
    // Объект представления с функцией загрузки медиа-ресурсов
    var loader:Loader = new Loader();
    // Начать загрузку
    loader.load(url, context);
    // Привязать слушатель события полной загрузки файла
       loader.contentLoaderInfo.addEventListener(Event.COMPLETE, handlerComplete);
}
public function handlerComplete(e:Event):void {
      // Добавить объект с загруженным растровым изображением в область отображения
      addChild(loader);
      try {
           // Явное преобразование к типу данных Bitmap
           bm = Bitmap(loader.content);
      }catch(e:Error) {
          // Среда выполнения сообщает об запрете не чтение содержимого. Класс ошибок - SecurityError
      }
}
Почему мне не доступно содержимое загруженного графического файла, если в xml-файле междоменной политики по адресу содержимое, которого
XML
1
2
3
4
<?xml version="1.0"?>
<cross-domain-policy>
  <allow-access-from domain="*" />
</cross-domain-policy>
явно указано правило разрешения использования ресурсов с любых доменов. В чем беда, что я упускаю из вида?
Ответ: richfich, и ошибок нет? Немного подправил под ИДЕ (для теста), все локально работает:
ActionScript 3
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
import flash.net.*;
import flash.display.*;
 
// Ссылка на объект с растровым изображением
var bm:Bitmap;
var loader:Loader;
main();
function main() {
    // Адрес расположения графического файла
    var uri:String = "https://i.ytimg.com/vi/wUGdtcE3xwg/hqdefault.jpg";
    // Объект для работы с протоколом http
    var url:URLRequest = new URLRequest(uri);
        /*Правило из документации Adobe : Если используется метод Loader.load(), задайте свойство checkPolicyFile параметра context, который является объектом LoaderContext. */
    // Оъект управления контекстом безопасности
    var context:LoaderContext = new LoaderContext();
    // Явное использование файла политики безопасности  
    context.checkPolicyFile = true; 
    // Объект представления с функцией загрузки медиа-ресурсов
    loader = new Loader();
    // Начать загрузку
    loader.load(url, context);
    // Привязать слушатель события полной загрузки файла
       loader.contentLoaderInfo.addEventListener(Event.COMPLETE, handlerComplete);
}
function handlerComplete(e:Event):void {
      // Добавить объект с загруженным растровым изображением в область отображения
      //addChild(loader);
      try {
           // Явное преобразование к типу данных Bitmap
           bm = Bitmap(loader.content);
           addChild(bm);
      }catch(e:Error) {
          // Среда выполнения сообщает об запрете не чтение содержимого. Класс ошибок - SecurityError
      }
}
Вопрос: Отложенная загрузка изображений

Здравствуйте форумчане. Не подскажете дельный совет, как лучше организовать отложенную загрузку изображений на сайте?
Идея такая, что при открытии страницы должны показываться заглушки вместо фоток, а потом подгружаться картинки. И основной смысл, чтобы данных о адресе картинки до её загрузки в теле страницы не было. Это нужно как попытка защититься от парсера.
Смысл в том, что парсер заходит, скачивает страницу и по ссылкам пытается скачать картинки, но там заглушки. а реальному пользователю через секунду(допустим) после полной загрузки страницы покажутся реальные картинки.
Ответ: он будет только раскодировать строки, а запросы будут обычные из браузера
Вопрос: Createjs. Получить размер изображения после scale

this.image = new Image();
this.bm = new createjs.Bitmap(this.image);
this.content.addChild(this.bm);
this.image.onload =this.loadComplit;
this.image.onerror = this.loadError;
s=...;
self.bm.scaleX=self.bm.scaleY=s;

Как получить новые размеры изображения?
Ответ: Нет, размер изображение не изменяется

Добавлено через 4 часа 47 минут
self.picWidth=this.width;
self.picHeight=this.height;
self.bm.width = self.bm.scaleX * this.picWidth;
self.bm.height = self.bm.scaleY * this.picHeight;
Вопрос: Подскажите плагин для открытия изображений в полный их размер в popup окне

lightbox, fancybox, colorbox открывают изображения только на высоту экрана, а надо чтоб если изображение больше экрана - оно появлялось в свой полный размер, и появлялась прокрутка. Подскажите такой плагин пжлст
Ответ: покажи пример как lightbox, fancybox, colorbox открывают, а то я не понял..