VPF::DIV'ный вопрос :) - Форум программистов

HipJ

Дата 23.1.2006, 13:02 (ссылка)

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

Загрузка ...

Шустрый

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

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

Здравствуйте!
Только что у меня возник вопрос..
Есть div,вот картинка smile

(допустим id="tstdiv",не суть)
При загрузке страницы св-во display этого div'a - none. При клике на кнопу btn (у меня это img со своим Id) display меняется на block,он раскрывается. Так вот вопрос, меня глючит, не могу его сейчас решить smile

.:
Как сделать чтобы при повторном клике по кнопке btn div снова становился display.none и наоборот, то есть как выполнить проверку открыт он или закрыт в одной функции?
Добавлено @ 13:10
Думаю либо через переменную, но никак не врублюсь, где её объявить и что в переменную записать smile

, либо через offsetHeight div'a.. но что-то мешает моему мозгу додумать smile

Illuminaty

Дата 23.1.2006, 13:11 (ссылка)

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

Загрузка ...

/*Антон Захаров*/

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

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

Код


var menuBlock = document.getElementById("tstdiv");
if (menuBlock.style.display == "none") {
    menuBlock.style.display = "block";
} else {
    menuBlock.style.display = "none";
}

HipJ

Дата 23.1.2006, 13:14 (ссылка)

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

Загрузка ...

Шустрый

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

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

Спасибо огромнейшее !!! smile

Всё понял =)

ОнКофе

Дата 15.3.2006, 11:13 (ссылка)

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 274
Регистрация: 3.3.2006
Где: http://www.angeli na-pitt.by.ru

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

я не понял как сделать, у меня никак не появляется этот <div> напишите код пожалуйста!!

HipJ

Дата 15.3.2006, 12:58 (ссылка)

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

Загрузка ...

Шустрый

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

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

Предположим, у тебя есть 2 div'a, один из которых является "кнопкой" при клике по которому открывается второй div (скрытый).
Даем скрытому div'у id="tstdiv"(имя соотв. любое), и свойство display равное none.

Код


<div id="buttondiv" onClick="showdiv()">Кнопка</div>
<div id="tstdiv" style="display:none">Скрытый блок, появляется при клике по "кнопке"</div>

Вот код функции:

Код


function showdiv()
{
var menuBlock = document.getElementById("tstdiv");
if (menuBlock.style.display == "none") {
    menuBlock.style.display = "block";
} else {
    menuBlock.style.display = "none";
}
}

При желании можно функцию модернизировать, для показа/скрытия любого элемента.

ОнКофе

Дата 15.3.2006, 13:56 (ссылка)

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 274
Регистрация: 3.3.2006
Где: http://www.angeli na-pitt.by.ru

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

HipJ,
а как переделать чтобы появлялось не при клике, а когда на первый DIV наводится мышка, и чтобы потом когда из второго дива мышка уходит он прятался сам?

DEER

Дата 15.3.2006, 14:11 (ссылка)

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 749
Регистрация: 12.4.2005
Где: г. Рязань

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

Код


<div id="buttondiv" onmouseover="showdiv()">Кнопка</div>    
<div id="tstdiv" style="display:none"  onMouseOver="showdiv()">Скрытый блок, появляется при клике по "кнопке"</div>

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

HipJ

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

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

Загрузка ...

Шустрый

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

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

ОнКофе, ну возьми отсюда какой-либо скрипт http://www.03www.ru/00/index.html smile

Добавлено @ 14:24

Цитата(DEER @ 15.3.2006, 14:11)

Код


<div id="buttondiv" onmouseover="showdiv()">Кнопка</div>    
<div id="tstdiv" style="display:none"  onMouseOver="showdiv()">Скрытый блок, появляется при клике по "кнопке"</div>

Да, только во втором диве надо ставить функцию не на mouseOver(тогда он пропадет как только ты наведешь на него мышкой, необходимо же убирать слой, когда мышка уходит с него),а на mouseOut -> тогда всё отлично работает (кстати самая простая реализация).
smile

Код


<div id="buttondiv" onmouseover="showdiv()">Кнопка</div>    
<div id="tstdiv" style="display:none"  onMouseOut="showdiv()">Скрытый блок, появляется при клике по "кнопке"</div>

ОнКофе

Дата 15.3.2006, 14:31 (ссылка)

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 274
Регистрация: 3.3.2006
Где: http://www.angeli na-pitt.by.ru

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

HipJ,
и что во всех браузерах работает? даже в старых версиях, ну там типа IE5.0 или IE5.5 ?

HipJ

Дата 15.3.2006, 14:34 (ссылка)

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

Загрузка ...

Шустрый

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

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

Возможности проверить работоспособность на IE 5 5.5 у меня нет, но всё должно работать отлично smile

Будет тебе домашнее задание, проверить работоспособность.

ОнКофе

Дата 15.3.2006, 15:04 (ссылка)

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 274
Регистрация: 3.3.2006
Где: http://www.angeli na-pitt.by.ru

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

HipJ, может тогда еще и ссылчку мне ? А то ведь такую древность (IE 5.0) уже не найдешь просто так

HipJ

Дата 15.3.2006, 16:07 (ссылка)

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

Загрузка ...

Шустрый

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

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

ну это уже ты сам, гугл никто не отменял

ОнКофе

Дата 16.3.2006, 13:26 (ссылка)

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 274
Регистрация: 3.3.2006
Где: http://www.angeli na-pitt.by.ru

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

такой вопрос

Код


<html>
<head>
<title></title>
<META http-equiv="Content-Type" content="text/html; charset=windows-1251">
 <Style>
.menu_light{background-color:#000000;font-family:Verdana,Arial;font-size:10px;font-weight:bold;color:#ffffff;text-decoration:none;}
.menu{background-color:#000000;border:1px solid #ffffff;border-bottom:0;padding:2px 5px;}

 </Style>
 
 
<script language="JavaScript">
function showdiv()    
{    
var menuBlock = document.getElementById("1");    
if (menuBlock.style.display == "none") {    
    menuBlock.style.display = "block";    
} else {    
    menuBlock.style.display = "none";    
}    
}
 </SCRIPT>

</head>
<body topmargin="0" leftmargin="0">

<table width="100" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="100" onmouseover="showdiv()" class="menu"><a href="/ind.htm" class="menu_light">Новости</a></td>

<td width="1" valign="top" onMouseOut="showdiv()">
<div id="1" style="display:none;position:absolute;width:150px;z-index:1;">
 <table border=0 cellPadding=0 cellSpacing=0 width=150 class="table">
   <tr><td class="menu"><a  class="menu_light" href="#">Пункт 1</a></td></tr>
   <tr><td class="menu"><a  class="menu_light" href="#">Пункт 2</a></td></tr>
   <tr><td class="menu"><a  class="menu_light" href="#">Пункт 3</a></td></tr>
   <tr><td class="menu"><a  class="menu_light" href="#">Пункт 4</a></td></tr>
   <tr><td class="menu"><a  class="menu_light" href="#">Пункт 5</a></td></tr>
   <tr><td class="menu"><a  class="menu_light" href="#">Пункт 6</a></td></tr>
   <tr><td class="menu"><a  class="menu_light" href="#">Пункт 7</a></td></tr>
   <tr><td class="menu"><a  class="menu_light" href="#">Пункт 8</a></td></tr>
   <tr><td class="menu"><a  class="menu_light" href="#">Пункт 9</a></td></tr>
</table>
</div>
</td>
</tr>
</table>
</body></html>

Почему когда мы двигаемся мышкой с "Пунка 1" по "Пункт 9" подменю постоянно мерцает??? Можно это как-нибудь изменить?

ОнКофе

Дата 16.3.2006, 16:42 (ссылка)

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 274
Регистрация: 3.3.2006
Где: http://www.angeli na-pitt.by.ru

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

Может это только у меня так дергается???

12345c

Дата 16.3.2006, 17:15 (ссылка)

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

Загрузка ...

Круглый

Профиль
Группа: Vingrad developer
Сообщений: 2018
Регистрация: 26.12.2005
Где: наша не пропадала ?

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

Нет, просто все сосредоточенно думают, почему так происходит.

Тут событие всплывает из TD внутренней таблицы, регистрируется на TD внешней, и моргает, потому что аналогично работает всплывающее событие из TABLE внутренней таблицы. Хочется сразу поставить задержку, она работает, но неровно, и весь скрипт - по-разному в разных бр. . Стоит поискать другое решение, не забывая, что события всплывают. Их можно отсекать от всплывания в случае чего.

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