Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 03.10.2013, 12:32
Аватар для Arramis
Кандидат Javascript-наук
Отправить личное сообщение для Arramis Посмотреть профиль Найти все сообщения от Arramis
 
Регистрация: 22.07.2013
Сообщений: 104

поправить код
здравстуйте господа.
Есть код который создает некоторое кол-во блоков внутри одного блока и распологает их отсортированно друг за другом (смотри выполнение).
<table>
	<tr>
		<td>
			<div id = "boxes_container">				
			</div>
		</td>
	</tr>	
</table>
<style>
table {
	margin: 0 auto;
}

#boxes_container {
	width: 500px;
	height: 350px;
	position: relative;
}

.hidden_box {
	margin: 1px;
	padding: 1px;
	border: 1px solid black;
	position: absolute;
}
</style>
<script type = 'text/javascript'>
	var boxesNumber = 12, boxContainer = document.getElementById("boxes_container");
	function createHiddenBoxes() {
		var hiddenBox;
		for (i = 0; i < boxesNumber; i++) {
			hiddenBox = document.createElement("div");
			hiddenBox.className = "hidden_box";
			hiddenBox.id = "hidden_box" + i;
			hiddenBox.style.width = 95 + 'px';
			hiddenBox.style.height = 70 + 'px';
			boxContainer.appendChild(hiddenBox);
		}
	}
	
	function sortHiddenBoxes() {
		var hiddenBoxes = boxContainer.getElementsByClassName("hidden_box"),
			x = 0, y = 0, deltaX = 100, deltaY = 75;									
		for (var i = 0; i < boxesNumber; i++) {
			if (i == 0) hiddenBoxes[i].style.top = 5 + 'px';
			if (i != 0 && i < 4) {
				x += deltaX;
				hiddenBoxes[i].style.left = x + 'px';
				hiddenBoxes[i].style.top = 5 + 'px';
			} 
		}
		x = -deltaX;
		for (var j = 0; j < boxesNumber; j++) {
			if (j > 3) {
				x += deltaX;
				y = deltaY;
				hiddenBoxes[j].style.left = x + 'px';
				hiddenBoxes[j].style.top = y + 'px';
			}
		}
		x = -deltaX;
		y = 2 * deltaY;
		for (var k = 0; k < boxesNumber; k++) {
			if (k > 7) {
				x += deltaX;
				hiddenBoxes[k].style.left = x + 'px';
				hiddenBoxes[k].style.top = y + 'px';
			}
		}
	}	
	createHiddenBoxes(); sortHiddenBoxes();		
</script>
необходимо переписать функцию sortHiddenBoxes() так чтобы она каждый раз динамически отрисовывала блоки в зависимости от переменной boxesNumber в которой указывается число блоков - значение для этой переменной тянется из базы и иногда может быть разным (это кол-во картинок которые расположены в одной общей картинке (4 x 3, 5 x 20) по 4 картинки на каждой строке с 5ью столбцами и т.д.)
Мой гавнокодский вариант работает только для случая 4 x 3 (12 блоков - потому что большинство картинок будут иметь в себе 12 картинок, но большинство не означает ВСЕ!!).
Помогите избавиться от этих 3 циклов for() {} сделав код покороче и универсальнее (

Последний раз редактировалось Arramis, 03.10.2013 в 13:34.
Ответить с цитированием
  #2 (permalink)  
Старый 03.10.2013, 14:01
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Arramis,
может таблицу генерировать а не дивы?
Ответить с цитированием
  #3 (permalink)  
Старый 03.10.2013, 14:18
Аватар для Arramis
Кандидат Javascript-наук
Отправить личное сообщение для Arramis Посмотреть профиль Найти все сообщения от Arramis
 
Регистрация: 22.07.2013
Сообщений: 104

Сообщение от рони Посмотреть сообщение
может таблицу генерировать а не дивы?
а чем это может быть полезным ? выравнивать все равно придется
помоему
Ответить с цитированием
  #4 (permalink)  
Старый 03.10.2013, 15:07
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Arramis,
немогли бы вы пояснить что значит
Сообщение от Arramis
выравнивать все равно придется
и
Сообщение от Arramis
отсортированно
Ответить с цитированием
  #5 (permalink)  
Старый 03.10.2013, 15:23
Аватар для Arramis
Кандидат Javascript-наук
Отправить личное сообщение для Arramis Посмотреть профиль Найти все сообщения от Arramis
 
Регистрация: 22.07.2013
Сообщений: 104

Сообщение от рони Посмотреть сообщение
Arramis,
немогли бы вы пояснить что значит
функция sortHiddenBoxes() сдвигает каждый блок влево на deltaX пикселей
и сдвигает вниз на deltaY px если кол - во блоков > 3 или > 7 - получается такое некое выравнивание. Мне нужно чтобы эта функция выполнялась правильно (тоесть "выравнивала" блоки) в независомсти от кол - ва блоков. Даешь ему параметр колва блоков, deltaX, deltaY и она рисует столько сколько нужно и "выровненно".
Если генерировать таблицу то содержимое каждого tr и td надо будет тоже выравнивать (но уже с другими значениями deltaX и deltaY) чтобы все картинки из общей картинки накладывались на каждый этот блок ровно.

Последний раз редактировалось Arramis, 03.10.2013 в 15:28.
Ответить с цитированием
  #6 (permalink)  
Старый 03.10.2013, 15:44
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от Arramis
чтобы все картинки из общей картинки накладывались на каждый этот блок ровно.

... да и зачем сдвигать задали нужные отступы оно само ляжет как надо
Ответить с цитированием
  #7 (permalink)  
Старый 03.10.2013, 16:00
Аватар для Arramis
Кандидат Javascript-наук
Отправить личное сообщение для Arramis Посмотреть профиль Найти все сообщения от Arramis
 
Регистрация: 22.07.2013
Сообщений: 104

Сообщение от рони Посмотреть сообщение

... да и зачем сдвигать задали нужные отступы оно само ляжет как надо
на одной картинке много картинок которые фиксированны - тоесть они являются частью одного файла .jpg в котором нарисовани эти картинки.
Ответить с цитированием
  #8 (permalink)  
Старый 03.10.2013, 16:07
Аватар для Arramis
Кандидат Javascript-наук
Отправить личное сообщение для Arramis Посмотреть профиль Найти все сообщения от Arramis
 
Регистрация: 22.07.2013
Сообщений: 104

рони,
тоесть мне необходимо сдвигать именно эти созданные мною блоки а не сами картинки, потому что картинки на одной целой картинке доступа к которым из js я не имею потому что они находятся в другой картинке которая одна.
Ответить с цитированием
  #9 (permalink)  
Старый 03.10.2013, 16:18
Аватар для Arramis
Кандидат Javascript-наук
Отправить личное сообщение для Arramis Посмотреть профиль Найти все сообщения от Arramis
 
Регистрация: 22.07.2013
Сообщений: 104

рони,
если блоки не сдвигать они будут накладываться друг на друга - тоесть все блоки будут на первой картинке, а мне нужно чтобы каждый блок был наложен на каждой картинке.
Ответить с цитированием
  #10 (permalink)  
Старый 03.10.2013, 16:35
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Arramis,
моя твоя непонимать ...
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Не работает код Kendrick Internet Explorer 5 12.09.2012 16:14
Аккордеон меню, как доработать код. Gawk Общие вопросы Javascript 1 23.07.2012 13:01
Требуется выводить код рекламного блока Adsense из файла JavaScript??? speedflow Элементы интерфейса 0 26.05.2012 15:50
Как создать bodyclick код royksopp Общие вопросы Javascript 8 14.10.2011 16:39
код странно отрабатывает комбинацию клавиш ffx Общие вопросы Javascript 4 20.01.2011 10:58