Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 27.12.2013, 13:50
Новичок на форуме
Отправить личное сообщение для nefton Посмотреть профиль Найти все сообщения от nefton
 
Регистрация: 18.12.2012
Сообщений: 4

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

тоесть при онлоад мы сохраняем все отношения ширины окна к высоте и ширине всех элементов.

а потом при ресайз устонавливаем все широты и высоты и положение пропорционально новому размеру окна.

Елементов много, и в процессе разроботки они добавляются/убавляются.
Есть ли возможность перебрать их все чтоб не вручную описывать каждый?
Ответить с цитированием
  #2 (permalink)  
Старый 28.12.2013, 13:04
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 12,428

Сообщение от nefton
чтоб там перебирались все элементы в документе
Ну все перебирать точно не нужно...
Порой достаточно сделать резиновую верстку.
Если этого мало:
- нужным элементам дать специальный класс
- пробежаться по тем элементам и вычислить их размеры
Ответить с цитированием
  #3 (permalink)  
Старый 29.12.2013, 06:25
Новичок на форуме
Отправить личное сообщение для nefton Посмотреть профиль Найти все сообщения от nefton
 
Регистрация: 18.12.2012
Сообщений: 4

Table.Init = function (){
	
	//Рисуем сукно
	d=document.createElement('div');
	d.id='sukno';
	d.style.position='absolute';
	d.style.left='140px';
	d.style.top='110px';
	d.style.width='480px';
	d.style.height='280px';
	d.style.borderRadius='240px/140px';
	d.style.background='rgb(1,157,90)';
	document.getElementById("bacground").appendChild(d);
	
	for(var seat=0; seat<9; seat++){
		
		d=document.createElement('div');
		d.style.position='absolute';
		d.id='player_bet_'+seat; 
		d.style.left=[200,110,30,100,130,280,360,360,300][seat]+'px';
		d.style.top=[210,190,100,40,20,20,80,120,190][seat]+'px';
		d.style.width='70px';
		d.style.height='20px';
		d.style.color = 'white';
		d.style.textAlign = 'center';
		document.getElementById('sukno').appendChild(d);
	}
}


Все эти цифры актуальны для размера окна 816х535

Хотолось бы чтото типа
Размер_дива = обьект{height, width};
Размеры_дивов = массив_обьектов типа Размер_дива;
OnInit = function(){
    for (для всех div в документе){
        Размеры_дивов.push(div_height, div_width);
    }
}

OnResize = function(){
    for (для всех div в документе){
        div_height = Размеры_дивов[i].height*текущая_высота_окна/535;
        div_width = Размеры_дивов[i].width*текущая_ширина_окна/816;
    }
}


ну ещё+ позиция х и у и радиус скругления, но то уже детали.

Последний раз редактировалось nefton, 29.12.2013 в 06:30.
Ответить с цитированием
  #4 (permalink)  
Старый 03.01.2014, 08:22
Профессор
Отправить личное сообщение для kostyanet Посмотреть профиль Найти все сообщения от kostyanet
 
Регистрация: 23.10.2010
Сообщений: 2,719

В стилях переключаются секции для того или иного размера дивайса через @media

http://www.w3schools.com/css/css_mediatypes.asp
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Полная загрузка всех элементов на странице Serpanok jQuery 3 10.11.2011 18:29
Суммирование значений всех элементов div frolvict jQuery 1 11.07.2011 16:05
Как изменить свойство css у всех элементов одного класса AlexJ Events/DOM/Window 7 19.03.2011 05:25
Высота страницы (не окна). ostwest Events/DOM/Window 7 07.01.2011 20:34
Как изменить background всех дочерних элементов внутри <div>? libinstyle Общие вопросы Javascript 2 24.03.2010 12:25