Войти

Показать полную графическую версию : AJAX Tabs или простой DHTML

Netloger
30-08-2007, 03:35
Здравствуйте, уважаемые форумцы.

Подскажите пожалуйста, мне необходимо сделать миниблок, как на newsland.ru (правый миниблок Новости, Источники) :)

Поясню что хотелось бы сделать. Есть блок, две вкладки. Вкладка 1 и вкладка 2. Жмешь вкладку 1 внизу появляется контент, уже заранее известный, тоесть лежит в слое к примеру. Нажимаешь вкладку 2 и в том же слое появляется другой контент, который собственно лежит в другом слое.

Подскажите каким образом реализовать, все слоями и стилями? И если не сложно с примером. :)

Смотрел разработку http://www.zapatec.com/website/main/products/tabs/demo.jsp#basic.html но мне кажется что можно сделать как-то проще.

Заранее спасибо за ответ.
Coutty
30-08-2007, 09:57
<html><head><title>1</title>
</head>
<body>
<a href=# onClick="changeDiv('news')">Новости</a> | <a href=# onClick="changeDiv('nenews')">Источники</a>
<div id="news" style="position:absolute; top:50; left:50">Тут идёт разный текст 1</div>
<div id="nenews" style="position:absolute; top:-50000; left:-50000">Тут совершенно другой текст О_О</div>
<script>
<!--
function changeDiv(myaso) {
if (myaso == 'news') // проверяем: если нужно показать слой news, то
{
shashlik = 'nenews'; // переменной "шашлык" присваиваем имя другого слоя
}
else if (myaso == 'nenews') // если надо показать слой nenews, то
{
shashlik = 'news'; // шашлыку - имя другого слоя.
}
kyu = document.getElementById(shashlik); // выбираем слой с именем, хранящимся в переменной "шашлык"
kyu.style.top = -50000; // и уносим его за край экрана
kyu.style.left = -50000;
nya = document.getElementById(myaso); // потом выбираем слой, который надо показать (имя передано в переменную "мясо"
nya.style.top = 50; // и переносим в нужное место
nya.style.left = 50;
}
//-->
</script>
</body>
</html>
Prisoner
30-08-2007, 16:12
Или так (http://forum.mootools.net/viewtopic.php?id=2149). См. первый пост в топике там ссылка на homepage проекта.
Netloger
30-08-2007, 20:53
Хм, Prisoner, поглядел ссылку, в лисе работает нормально тестовый вариант, а вот при использовании у себя, слои разбегаются, весь диз на слоях. А в IE все отлично. С чем связано? С разным восприятием? Вроде как я проверил на демке он кроссбраузерный.

Возможно диз кривой?

Вставляется как просто текст и все, может стили виноваты?

Coutty, не завелся. :(

Отбой, завелся и везде заработало. Всем спасибо еще раз за помощь.



© OSzone.net 2001-2012