Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Как при наведении на ссылку отображать объекты под классом visibility: hidden; (https://javascript.ru/forum/misc/10382-kak-pri-navedenii-na-ssylku-otobrazhat-obekty-pod-klassom-visibility-hidden%3B.html)

pavdin 01.07.2010 17:25

Как при наведении на ссылку отображать объекты под классом visibility: hidden;
 
Есть
<DIV id="smile" class="notOfficial"></DIV>
<DIV id="tabletWithChips" class="notOfficial"></DIV>
<DIV id="cigarettes" class="notOfficial"></DIV>
<DIV id="ashTray" class="notOfficial"></DIV>
<DIV id="beer" class="notOfficial"></DIV>
<DIV id="magazinesPorno" class="notOfficial"></DIV>
<DIV id="notepadPorno" class="notOfficial"></DIV>


В css прописано
#header .notOfficial { visibility: hidden; }

Как при наведении на определённую ссылку на странице отображать скрытые блоки средствами javascript

subzey 01.07.2010 17:37

Так же, использовать css.

<style>
#header .notOfficial { visibility: hidden; }
#header.showNotOficcial .notOfficial { visibility: visible; }
</style>
<div id="header">
	<DIV id="smile" class="notOfficial">Smile</DIV>
	<DIV id="tabletWithChips" class="notOfficial">Tablet With Chips</DIV>
	<DIV id="cigarettes" class="notOfficial">Cigarettes</DIV>
	<DIV id="ashTray" class="notOfficial">Ash Tray</DIV>
	<DIV id="beer" class="notOfficial">Beer</DIV>
	<DIV id="magazinesPorno" class="notOfficial">Porn Zines</DIV>
	<DIV id="notepadPorno" class="notOfficial">Porn Pad</DIV>
</div>

<a href="javascript://" onmouseover="document.getElementById('header').className = 'showNotOficcial'" onmouseout="document.getElementById('header').className = ''">Блекджек и шлюхи</a>


Лучше, конечно, использовать addClass и removeClass, но для примера, думаю, пойдет.

pavdin 01.07.2010 17:48

Спасибо огромное, работает... осталось только решить, как
при наведении на эту же ссылку, пропадали объекты
под class="official"???

<A id="notepad" class="official" href="#" title="#"></A>
<A id="camera" class="official" href="#" title="#"></A>

subzey 01.07.2010 17:51

#header .notOfficial { visibility: hidden; } 
#header.showNotOficcial .notOfficial { visibility: visible;} 
#header.showNotOficcial .official { visibility: hidden;}


И мой Вам совет: учите css. Это Вам очень поможет в разработке.

pavdin 01.07.2010 17:58

Получилось.... Спасибо огромное....

Вот промер того, что я хотел.... Нажимаешь на логотип и .... :). Супер....
А реально сделать, чтобы картинки, которые подменяются, подменялись плавно туда и обратно?

pavdin 01.07.2010 17:59

http://cp769028.cpanel.tech-logol.ru...ec/gaz-vrn.htm

Octane 01.07.2010 18:03

pavdin, не дублируйте сообщения

subzey 01.07.2010 19:10

Вложений: 1
В аттаче пример. Из-за data-url он большой.
В тех браузерах, которые уже понимают css transitions, смена будет плавной. В остальных — резкой.

pavdin 02.07.2010 15:18

Спасибо большое!!!


Часовой пояс GMT +3, время: 16:13.