Форум

vjuenf · #1 (**permalink**) 17.08.2012, 13:22

нужно,чтобы в зависимости от ширины окна браузера менялась ширина объекта #page по принципу: если размер такойто - применить к объекту #page такойто класс. и что бы это работало постоянно,реагируя на последующие изменения размеры окна браузера

lord2kim · #2 (**permalink**) 17.08.2012, 13:34

vjuenf, или

<body onResize="func()">

или

window.onresize = function () {  }

var wwidth=(window.innerWidth)?window.innerWidth:
    ((document.all)?document.body.offsetWidth:null);
var wheight=(window.innerHeight)?window.innerHeight:
    ((document.all)?document.body.offsetHeight:null);
switch (true) {
  case (wwidth == 1000 && wheight == 1000): {}
  case (...): {}
  ...
}

vjuenf · #3 (**permalink**) 17.08.2012, 13:40

мне бы через if else...
можно более подробно,всё необходимое, т.к.я не довъехал..

lord2kim · #4 (**permalink**) 17.08.2012, 15:05

vjuenf,

window.onresize = function() {
  var wwidth=(window.innerWidth)?window.innerWidth:
    ((document.all)?document.body.offsetWidth:null),
  page = document.getElementById("page");
  if (wwidth == 1000) { page.style.width = 1000; }
  else { if (wwidth == 2000) { page.style.width = 2000; }
  else { ... } }
}

vjuenf · #5 (**permalink**) 17.08.2012, 19:31

возможно,я туплю, но по моему онресайз - изменение размера,окна,а надо, что бы он менял размер не только при изменении размера окна, но и изначально корректировал размер, т.е. при загрузке сайта - прошёл вилку и при ресайзе тоже.

если не сложно - выложи фул для кода:

<html>
<head>
<style>
.page{
width:1100px;
}
</style>
</head>
<body>
<div class="page">
много контента
</div>
</body>

lord2kim · #6 (**permalink**) 17.08.2012, 19:49

vjuenf,

<html>
<head>
<style>
#page{
width:1100px;
}
</style>
<script>
function resizebl() {
  var wwidth=(window.innerWidth)?window.innerWidth:
    ((document.all)?document.body.offsetWidth:null),
  page = document.getElementById("page");
  switch (true) {
    case wwidth == 1000: { page.style.width = 1000; }
    case wwidth == 2000: { page.style.width = 2000; }
  }
}

window.onresize = resizebl();
window.onload = resizebl();
</script>
</head>
<body>
<div id="page">
много контента
</div>
</body>
</html>

если конечно он правильно везде определяет размеры окна

vjuenf · #7 (**permalink**) 17.08.2012, 20:08

Если Вас это так бесит - не будете ли вы так любезны, рассказать, как выяснить ширину клиентской части?

lord2kim · #8 (**permalink**) 17.08.2012, 20:22

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

Если Вас это так бесит - не будете ли вы так любезны, рассказать, как выяснить ширину клиентской части?

как то так

w = (window.innerWidth ? window.innerWidth : (document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.offsetWidth));

vjuenf · #9 (**permalink**) 17.08.2012, 20:43

эх,если бы мне,нубскому существу ещё объяснили все элементы метода, предложенного lord2kim? т.к. я интересуюсь не только конкретным случаем,но и вообще системой...

Ваше негодование вполне понятно, НО!
1)я нуб. можно сказать полный.
2)я впринципе не предполагал таких вещей. т.е. я знал,о боковых панелях, но того, что всё так сложно я не предполагал,т.к. не понимаю зачем вообще нужна ширина всего окна,если влияь можно только на клиентскую часть?

vjuenf · #10 (**permalink**) 17.08.2012, 21:25

мой мозг не понимает таких умных рассуждений. можно бытовыми словами и поподробнее?

а, да хотел спросить:
1)почему вместо класса page поставлен id? через document.getelementsbyclassname нельзя аналогично?

2)мне тяжеловато разбираться в case'ах, ядаже в заголовке просил через ifelse... как выглядит последний результат в ifelse?

Форум

Справочник

Discord чат

Курсы javascript