VPF::Отображение и скрытие div'а - Форум программистов

langolier

Дата 26.8.2008, 16:14 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 32
Регистрация: 29.7.2008

Репутация: нет
Всего: нет

Как отобразить скрытый div пр нажатии на ссылку, и скрыть его при нажатии на другую ссылку.. надеюсь меня поняли))и
сори за ламерский вопрос)

bars80080

Дата 26.8.2008, 16:19 (ссылка)

(нет голосов)

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 44
Всего: 315

Код


<div id="qw">wqpoir bqweroqw e</div>
<a href="javascript:void(0);" onclick="document.getElementById('qw').style.display='block';">open div</div>
<a href="javascript:void(0);" onclick="document.getElementById('qw').style.display='none';">close div</div>

langolier

Дата 26.8.2008, 20:24 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 32
Регистрация: 29.7.2008

Репутация: нет
Всего: нет

Может заодно кто-нить подскажет:
Как по такому принципу реализовать что-то типа вкдладок?
Т.е. как наложить один div на другой??
И принажатии на ссылку переключать их...

comtat

Дата 26.8.2008, 21:02 (ссылка)

(нет голосов)

Загрузка ...

Эксперт

Профиль
Группа: Завсегдатай
Сообщений: 1310
Регистрация: 2.5.2006
Где: Россия, Казань

Репутация: 7
Всего: 71

Принцип такой .. для красоты обвесь стилями и будет отлично

Код


<html>
<head></head>
<body>
<style>
.hidden { display:none;}
.inline { display:inline;}
</style>
<script>
function show(divId) {
    div_status = 0; //0- hidden, 1- active
    if (document.getElementById(divId).className == "inline")
       div_status = 1;
    elems = document.getElementsByTagName("div");
    r = /div(\d+)/i;
    for (i = 0; i < elems.length; i++) {
        arr = r.exec(elems[i].id);
        if (arr != null && arr.length > 1) {
            elems[i].className = 'hidden';
        }
    }
    document.getElementById(divId).className = "inline";
}
</script>
<table>
<tr>
<td colspan=3>
    <a href="#" id=a1 onclick="show('div1')">LINK1</a>&nbsp;
    <a href="#" id=a2 onclick="show('div2')">LINK2</a>&nbsp;
    <a href="#" id=a3 onclick="show('div3')">LINK3</a>
</td>
</tr>
<tr>
<td><div id=div1 class="inline">СОДЕРЖАНИЕ1</div></td>
<td><div id=div2 class="hidden">СОДЕРЖАНИЕ2</div></td>
<td><div id=div3 class="hidden">СОДЕРЖАНИЕ3</div></td>
</tr>
</table>
</body>
</html>

--------------------

Рожденный в СССР !!!
ExtJS - мой фреймворк

langolier

Дата 26.8.2008, 21:14 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 32
Регистрация: 29.7.2008

Репутация: нет
Всего: нет

Спасибо)
Лучше и не может быть smile

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: для новичков \| Следующая тема »