Форум

Шацкий Денис · #1 (**permalink**) 09.01.2011, 07:12

Добрый день! Нашёл скрипт на определение размеров клиентской части браузера.
Код(немного дописан, но суть не изменилась):

function screenSize() {
      var l, l2, w, h, h1, w1, i; // Объявляем переменные, w - длина, h - высота
      w = (window.innerWidth ? window.innerWidth : (document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.offsetWidth));
      h = (window.innerHeight ? window.innerHeight : (document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.offsetHeight));
      
	  h1 = h / 158;
	  w1 = w / 150;
	  l = Math.round(h1);
	  l2 = Math.round(w1);
	return {l2:l2,l:l, h1:h1, w1:w1, w:w, h:h};
	
	

// Пример:
for (i=1;i<=screenSize().l;i=i+1) {
document.write( '<p align = left><img src ="r1.png"</img>');}
document.write(
	
      "Длина = " + screenSize().w + "px<br>" +
      "Высота = " + screenSize().h + "px<br>" +
	  "По длине = " + screenSize().l + " шт.<br>" +
	  "По высоте = " + screenSize().l2 + " шт." 
);

Как сделать так, чтобы скрипт стал интерактивным что ли?

Ведь в этом варианте размеры проверяются только при обновлении страницы

monolithed · #2 (**permalink**) 09.01.2011, 07:41

есть обработчик события onresize

Шацкий Денис · #3 (**permalink**) 09.01.2011, 07:48

Сообщение от monolithed

есть обработчик события onresize

А можно немного подробнее, как его вставить в исходный код

Vulkan · #4 (**permalink**) 09.01.2011, 09:02

Можно так:

<body onresize="function();">

Шацкий Денис · #5 (**permalink**) 09.01.2011, 15:05

У меня всё равно ничего не получается

не работает document.write и соответственно картинка не пропечатывается... подскажите, пожалуйста подробнее

monolithed · #6 (**permalink**) 09.01.2011, 16:58

Шацкий Денис скажите что вы делате?

Aetae · #7 (**permalink**) 09.01.2011, 17:10

document.write и не должен работать.
Почитайте хотя-бы основы javascript.

Шацкий Денис · #8 (**permalink**) 09.01.2011, 17:53

Ну это я понял, что document.write не будет работать. Ну а как тогдаорганизовать вставку png файла? Задумка была такая: Считываем размеры клиентской части браузера, делим эти показатели на размеры png-файла и вставляем их (png-файлы) через document.write....Может я чего-то не понимаю, но можно ли такое реализовать на javaScript?

Vulkan · #9 (**permalink**) 09.01.2011, 19:01

Скрипт вообще не рабочий был, даже кое-где фигурных скобок не хватало, короче хоть как-то его переделал, сейчас работает.

<head>
<script>
function getClientWidth() {
    return document.compatMode == 'CSS1Compat' && !window.opera ? document.documentElement.clientWidth : document.body.clientWidth;
}

function getClientHeight() {
    return document.compatMode == 'CSS1Compat' && !window.opera ? document.documentElement.clientHeight : document.body.clientHeight;
}

function ss() {
    var l, l2, w, h, h1, w1, i;
    w = getClientWidth();
    h = getClientHeight();
    h1 = h / 158;
    w1 = w / 150;
    l = Math.round(h1);
    l2 = Math.round(w1);
    return {
        l2: l2,
        l: l,
        h1: h1,
        w1: w1,
        w: w,
        h: h
    }
}

window.onload = function () {
    var screenSize = ss(),
        div = document.getElementsByTagName('div')[0];

    // Пример:
    for (i = 1; i <= screenSize.l; i = i + 1)
    div.innerHTML += '<p align = left><img src="r1.png"/>';
    div.innerHTML += "Длина = " + screenSize.w + "px<br>Высота = " + screenSize.h + "px<br>По длине = " + screenSize.l + " шт.<br>По высоте = " + screenSize.l2 + " шт.";
}
</script>
</head>

<body>
<div></div>
</body>

Vulkan · #10 (**permalink**) 09.01.2011, 19:06

Насчёт определения размера, можно например указывать ссылку на картинку и определять её размеры

Форум

Справочник

Discord чат

Курсы javascript