Показать сообщение отдельно
  #3 (permalink)  
Старый 04.08.2011, 14:04
Аватар для greatilya
Интернет-турист
Отправить личное сообщение для greatilya Посмотреть профиль Найти все сообщения от greatilya
 
Регистрация: 01.08.2008
Сообщений: 516

Да код любой, например:
JS с использованием mootools:
<script language="javascript">
function open_child(iId) {
	var miniSize = $("mini_"+iId);
	var fullSize = $("full_"+iId);
	if(miniSize.hasClass("open")) {
		miniSize.removeClass("open");
		miniSize.addClass("close");
		fullSize.removeClass("close");
		fullSize.addClass("open");
	}
}

function close_child(iId) {
	var miniSize = $("mini_"+iId);
	var fullSize = $("full_"+iId);
	if(miniSize.hasClass("close")) {
		miniSize.removeClass("close");
		miniSize.addClass("open");
		fullSize.removeClass("open");
		fullSize.addClass("close");
	}
}
</script>


HTML код:
<div class="m1">

<div id="full_1" class="left close fullSize" onclick="close_child(1)">1111111111111111</div>
<div id="full_5" class="right close fullSize" onclick="close_child(5)">1111111111111111</div>
<div id="mini_1" class="left open miniSize" onclick="open_child(1)">1</div>
<div id="mini_5" class="right open miniSize" onclick="open_child(5)">1</div>

<div id="full_2" class="left close fullSize" onclick="close_child(2)">22222222222222222222</div>
<div id="full_6" class="right close fullSize" onclick="close_child(6)">2222222222222222222222</div>
<div id="mini_2" class="left open miniSize" onclick="open_child(2)">2</div>
<div id="mini_6" class="right open miniSize" onclick="open_child(6)">2</div>

<div id="full_3" class="left close fullSize" onclick="close_child(3)">333333333333333333333</div>
<div id="full_7" class="right close fullSize" onclick="close_child(7)">33333333333333333333333</div>
<div id="mini_3" class="left open miniSize" onclick="open_child(3)">3</div>
<div id="mini_7" class="right open miniSize" onclick="open_child(7)">3</div>

<div id="full_4" class="left close fullSize" onclick="close_child(4)">44444444444444444444444</div>
<div id="full_8" class="right close fullSize" onclick="close_child(8)">4444444444444444444444444</div>
<div id="mini_4" class="left open miniSize" onclick="open_child(4)">4</div>
<div id="mini_8" class="right open miniSize" onclick="open_child(8)">4</div>

<div class="clear"></div>
</div>


CSS код:
.m1 { margin:0 auto; }
.miniSize { width:392px; }
.fullSize { width:784px; }
.left { float:left; background:#66FFFF; border:#999999 1px solid; }
.right { float:right; background:#FF99FF; border:#999999 1px solid; }
.open { display:block; }
.close { display:none; }


Проблема:
нужно заставить элементы и с классом left (и miniSize) отображаться только слева, а с классом right (и miniSize) только справа. С классом fullSize выводится на всю ширину ( width:784px; ).
__________________
VPS от 175 рублей (есть скидки 15% писать в ПМ) Анализ рынка VPS серверов
Есть только две бесконечные вещи: Вселенная и глупость. Хотя насчет Вселенной я не уверен.
Альберт Эйнштейн

Последний раз редактировалось greatilya, 04.08.2011 в 14:07.
Ответить с цитированием