Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 09.12.2013, 21:30
Профессор
Отправить личное сообщение для Faab Посмотреть профиль Найти все сообщения от Faab
 
Регистрация: 16.04.2012
Сообщений: 310

Помогите понять "глюк"
$(document).ready(function() {
  var eImg0 = document.querySelectorAll(".b-slider-img-container--img")[0];
  var oImg0Style = window.getComputedStyle(eImg0);
  var iImg0Width = parseInt(oImg0Style.getPropertyValue('width'));
  var iImg0Height = parseInt(oImg0Style.getPropertyValue('height'));
  console.log('iImg0Width = ' + iImg0Width);
}


При верстании (на локалке) у меня через раз выходит iImg0Width = 0.. Это начинает очень бесить и , вдруг, такие сюрпризы будут всплывать и на сервере? Почему проскакивает такая ширина? Не успевает загружается в DOM?

Последний раз редактировалось Faab, 09.12.2013 в 21:41.
Ответить с цитированием
  #2 (permalink)  
Старый 09.12.2013, 22:14
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от Faab
Не успевает загружается в DOM?
DOM не причем. Просто не успевает загружаться.
Проверяй свойство eImg0.complete, и если оно false, то вешай обработчик onload и замеры делай уже в callback'е.
Ширину картинки можно получить проще (если картинки видимы):
img.offsetWidth
Но она включает в себя также border-width
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #3 (permalink)  
Старый 09.12.2013, 22:20
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,108

Faab,
или не $(document).ready а $(window).load
Ответить с цитированием
  #4 (permalink)  
Старый 09.12.2013, 22:31
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

рони, блин, хотел же написать, но пока разбирался с шириной - забыл )
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #5 (permalink)  
Старый 09.12.2013, 23:07
Профессор
Отправить личное сообщение для Faab Посмотреть профиль Найти все сообщения от Faab
 
Регистрация: 16.04.2012
Сообщений: 310

Сообщение от рони Посмотреть сообщение
Faab,
или не $(document).ready а $(window).load
Сообщение от danik.js Посмотреть сообщение
Faab,
рони, блин, хотел же написать, но пока разбирался с шириной - забыл )
А в чём заключается принципиальность использования $(window).load? Я думал это, выражаясь мягко, синонимы.
Ответить с цитированием
  #6 (permalink)  
Старый 09.12.2013, 23:15
Профессор
Отправить личное сообщение для Faab Посмотреть профиль Найти все сообщения от Faab
 
Регистрация: 16.04.2012
Сообщений: 310

Сообщение от danik.js Посмотреть сообщение
DOM не причем. Просто не успевает загружаться.
Проверяй свойство eImg0.complete, и если оно false, то вешай обработчик onload и замеры делай уже в callback'е.
Ширину картинки можно получить проще (если картинки видимы):
img.offsetWidth
Но она включает в себя также border-width
danik.js, я никогда не вешал колбеки на load().. я тут настрочил ерунду какую-то.. примерно такое ты имел в виду?

$(window).load(){
  var eImg0 = document.querySelectorAll(".b-slider-img-container--img")[0];
  if(eImg0.complete){
    var oImg0Style = window.getComputedStyle(eImg0);
    var iImg0Width = parseInt(oImg0Style.getPropertyValue('width'));
    var iImg0Height = parseInt(oImg0Style.getPropertyValue('height'));
    console.log('iImg0Width = ' + iImg0Width);
  }else{
    eImg0.load(null;null;funtion(){
      var oImg0Style = window.getComputedStyle(eImg0);
      var iImg0Width = parseInt(oImg0Style.getPropertyValue('width'));
      var iImg0Height = parseInt(oImg0Style.getPropertyValue('height'));
      console.log('iImg0Width = ' + iImg0Width);
    }){};
  };
};
Ответить с цитированием
  #7 (permalink)  
Старый 10.12.2013, 11:52
Аватар для animhotep
Профессор
Отправить личное сообщение для animhotep Посмотреть профиль Найти все сообщения от animhotep
 
Регистрация: 17.01.2013
Сообщений: 887

Сообщение от Faab
А в чём заключается принципиальность использования $(window).load?
http://api.jquery.com/load-event/
Цитата:
Run a function when the page is fully loaded including graphics.
Ответить с цитированием
  #8 (permalink)  
Старый 10.12.2013, 12:55
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Faab, нужно использовать либо $(window).load либо $(document).ready + $(img).load

$(window).load + $(img).load вариант лишен смысла.
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #9 (permalink)  
Старый 10.12.2013, 14:44
Профессор
Отправить личное сообщение для Faab Посмотреть профиль Найти все сообщения от Faab
 
Регистрация: 16.04.2012
Сообщений: 310

Спасибо. Разница оказывается большая. Я так понимаю ready создана лишь для того что бы экономить время там, где работа скрипта не связана напрямую с изображениями?
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
помогите понять код с замыканием alexandr_poskrobka Общие вопросы Javascript 4 04.10.2012 21:44
Помогите понять поведение скрипта demoniqus Общие вопросы Javascript 3 02.03.2012 09:58
помогите уже месяц не могу понять как это сделать... CTEPEOTUn Общие вопросы Javascript 5 13.04.2011 00:21
Анимация. Помогите понять почему не работает. kadurban jQuery 4 08.07.2010 20:50
Помогите понять что надо "Удобное дерево" Fridrih AJAX и COMET 2 02.04.2010 10:12