Модераторы: Sardar, Aliance
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Получить размеры рабочей области окна в Chrome, Во всех других браузерах (даже IE!) ок! 
V
    Опции темы
InfMag
Дата 12.9.2011, 16:12 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата



***


Профиль
Группа: Завсегдатай
Сообщений: 1037
Регистрация: 21.11.2004

Репутация: 2
Всего: 4



В общем стоит следующая задача задача: я создаю новое окно window.open(…), внутри примитивный html-код, css таков: 
Код

html, body {width: 100%; height: 100%;}
html {overflow: hidden;}
* {margin: 0; padding: 0; border: 0;}

И мне нужно получить размер рабочей области окна. В моём арсенале так же jQuery. Я получаю в любом из браузеров (кроме Chrome) это следующим образом:
Код

var wnd = window.open('', 'olalaWND');

wnd.document.open();
wnd.document.write(html);
wnd.document.close();

$(wnd.document).width();
$(wnd.document).height();

Сам html код внутри окна следующий: 
Код

<html><head><title>check</title>
<style type="text/css">html, body {width: 100%; height: 100%;} html {overflow: hidden;} * {margin: 0; padding: 0; border: 0;}</style>
</head><body></body></html>

Дак вот, везде размеры я получаю без проблем. Но в Chrome полная труба, я долго возился, что только я не прибовал, ничего не вышло, вылазит нуль и всё тут, для Chrome 100% == 0, у меня постепенно появляется ощущение, что я начинаю не любить Chrome больше Opera и даже больше IE6! Там хоть как-то выкрутиться можно, а тут ни вправо ни влево. Я и блоки внутри вкладывал, обворачивал, и пробовал инкрементить по пикселю до появления скрулла, но! Если например внутри есть 100px блока и делаем scrollBy(40000, 0), получим document.scrollLeft == 100, при том, что на самом деле никакого скрулла и сдвига по скруллу в помине нету. Полная труба. Помогите, у кого какие идеи есть?

Добавлено через 5 минут и 49 секунд
Я даже пробовал создавать Input и инкрментить ему отступ и передавать фокус, в надежде, что если появился скрулл он сдвинется к месту фокуса, но не тут-то было, пока ничего не тыкнешь, к месту фокуса скрулла не видать.
PM   Вверх
mcTep
Дата 12.9.2011, 20:04 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 203
Регистрация: 25.2.2009

Репутация: 1
Всего: 6



Как я понял, у вас по коду вы сначала открываете окно (2 раза), потом загружаете туда контент и закрываете. И уже после закрытия хотите получить высоту и ширину окна. Попробуйте получить эти значения до закрытия окна. 
И если не секрет, какую цель вы преследуете такими манипуляциями?

К тому же мой хром блокирует всплытие окна таким образом. 
PM MAIL   Вверх
InfMag
Дата 12.9.2011, 20:19 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата



***


Профиль
Группа: Завсегдатай
Сообщений: 1037
Регистрация: 21.11.2004

Репутация: 2
Всего: 4



mcTep, нет, обратите внимание, не wnd.open/close, а wnd.document.open/close. Я открываю ввод в документ, пишу html код и закрываю ввод. Окно остаётся открытым. А цель моя — подогнать ширину/высоту окна под dom-элемент фиксированного размера внутри этого окна. Я тут его не описывал, изначально код такой, а потом уже после подгонки добавляется сам dom-элемент. Я создаю окно с заранее известными размерами (тут тоже не описал), но чтобы оно точно вмещало в рабочую область весь dom-элемент, мне нужно высоту-ширину рабочей области окна узнать, чтобы учитывая ширину-размер при создании окна высчитать излишек бордюров и произвести resizeTo с новым значением.

Добавлено через 4 минуты и 13 секунд
Это прекрасно работает соответствуя логике везде, окромя Хрома. Как я вывел, в Chrome процентные значения CSS соответствуют логическим ожиданиям только визуально, в JS любое значение процента будет эквивалентно нулю, это произвол! Даже Safari, родственник Chroma, ибо webkit прекрасно выполняет свои задачи на этот счёт.
PM   Вверх
mcTep
Дата 12.9.2011, 20:27 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 203
Регистрация: 25.2.2009

Репутация: 1
Всего: 6



А попробуйте сделать задержку после write() типа:
Код

var wnd = window.open('', 'olalaWND');

wnd.document.open();
wnd.document.write(html);

setTimeout(function(){
    wnd.document.close();
    $(wnd.document).width();
    $(wnd.document).height();
}, 1000);


что получится? Может окно не успевает сгенерироваться?
PM MAIL   Вверх
InfMag
Дата 12.9.2011, 20:37 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата



***


Профиль
Группа: Завсегдатай
Сообщений: 1037
Регистрация: 21.11.2004

Репутация: 2
Всего: 4



Вот к примеру код накидал:
Код

<html>
<head>
<title>olala test</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
    $('a').click(function () {
        var    html = '<html><head><title>check</title>'
            +'<style type="text/css">html, body {width: 100%; height: 100%; background: red;}'
            +'html {overflow: hidden;} * {margin: 0; padding: 0; border: 0;}</style>'
            +'</head><body></body></html>';
        
        var wnd = window.open('', 'olalaWND', 'width=800,height=600,resizable=yes');
        
        wnd.document.open();
        wnd.document.write(html);
        wnd.document.close();
        
        var needW = 300, needH = 300;
        var diffX = 0, diffY = 0;
        wnd.resizeTo(needW, needH);
        var w = $(wnd.document).width(), h = $(wnd.document).height();
        
        if (w < needW) {
            diffX = needW - w;
        } else {
            diffX = -(w - needW);
        }
        
        if (h < needH) {
            diffY = needH - h;
        } else {
            diffY = -(h - needH);
        }
        
        wnd.resizeTo((needW + diffX), (needH + diffY));
        
        $(wnd.document).find('body').html('<div style="width: '+ needW +'px; height: '+ needH +'px; background: green;"></div>');
        
        return false;
    });
});
</script>
</head>
<body>
<a href="#">Click here</a> or GOU OWEI!
</body>
</html>


UPD: поправил код, накосячил. Пусть не пугает последовательность действий, в моём случае ситуация такая, что я до создания окна не знаю размеров блока.

Добавлено @ 20:49
Код будет работать везде, кроме Хрома.

Это сообщение отредактировал(а) InfMag - 12.9.2011, 20:49
PM   Вверх
InfMag
Дата 12.9.2011, 20:56 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата



***


Профиль
Группа: Завсегдатай
Сообщений: 1037
Регистрация: 21.11.2004

Репутация: 2
Всего: 4



mcTep, вот жеж оно! Действительно! Я вроде и пробовал, только видимо как-то не так, получаю w/h по setTimeout и всё ок! Чертовщина какая, причём минимум 100 мс надо делать. Этож ведь не тру. Хм. Есть идея конечно навесить событие на резайз окна и продолжать таким образом. А то ведь задержка от случая к случаю разная, были б хоть каллбеки какие-нибудь. По всей видимости Хром сделал асинхронным resizeTo, хоть бы каллбеки предусмотрели.
PM   Вверх
InfMag
Дата 12.9.2011, 21:51 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата



***


Профиль
Группа: Завсегдатай
Сообщений: 1037
Регистрация: 21.11.2004

Репутация: 2
Всего: 4



Это конечно не в какие ворота не лезет! Я навешиваю на окно resize и он при резайзе выполняется конечно, но ДО того как РЕЗАЙЗ ЗАКОНЧИТСЯ и новые размеры примутся. Ну «кудесники» из Гугл меня конечно удивили.

Добавлено через 10 минут и 18 секунд
От 70 мс и более хватает задержки, но это же у кого как, эх, Хром - УГ.
PM   Вверх
InfMag
Дата 12.9.2011, 23:08 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата



***


Профиль
Группа: Завсегдатай
Сообщений: 1037
Регистрация: 21.11.2004

Репутация: 2
Всего: 4



Решил проблему следующим образом: записывал размеры в переменную, потом вызывал функцию, в которой проверял, если полученный размер совпадает с предыдущим, то вызываем функцию повторно. Таким образом функция ждёт, пока значения не изменятся.
PM   Вверх
mcTep
Дата 13.9.2011, 10:45 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 203
Регистрация: 25.2.2009

Репутация: 1
Всего: 6



Попробуйте повесить функцию получения размеров на событие DOMReady нового документа. Ведь это время может быть разное на разных машинах пользователей.
PM MAIL   Вверх
InfMag
Дата 13.9.2011, 21:17 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата



***


Профиль
Группа: Завсегдатай
Сообщений: 1037
Регистрация: 21.11.2004

Репутация: 2
Всего: 4



mcTep, пробовал бесполезно. Я же говорю, уже сделал, путём рекурсии. Вот тут можно посмотреть: http://unclechumind.blogspot.com/2011/09/j...ure-viewer.html
PM   Вверх
mcTep
Дата 14.9.2011, 13:27 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 203
Регистрация: 25.2.2009

Репутация: 1
Всего: 6



Это злостный хак smile Лучше вешать на событие.
PM MAIL   Вверх
InfMag
Дата 14.9.2011, 16:39 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата



***


Профиль
Группа: Завсегдатай
Сообщений: 1037
Регистрация: 21.11.2004

Репутация: 2
Всего: 4



mcTep, ну хак-не хак, а в Chrome по другому никак, я же вроде наглядно описал, что вешать событие, значит заранее рассчитывать, что в Chrome работать не будет. Плюс ко всему, в нормальных браузерах значения совпадать не будут и ни не будет ни одного рекурсивного повторения. Да и в чём тут злость хака? Вешать задержку таймера с миллисекундами навскидку (авось повезёт), — это много кратно злостнее, а плюс ко всему совсем не надёжно. Или я не прав?
PM   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
Форум для вопросов, которые имеются в справочниках, но их поиск вызвал затруднения, или для разработчика требуется совет или просьба отыскать ошибку. Напоминаем: 1) чётко формулируйте вопрос, 2) приведите пример того, что уже сделано, 3) укажите явно, нужен работающий пример или подсказка о том, где найти информацию.
 
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: Общие вопросы | Следующая тема »


 




[ Время генерации скрипта: 0.0710 ]   [ Использовано запросов: 22 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.