Javascript-форум (https://javascript.ru/forum/)
-   (X)HTML/CSS (https://javascript.ru/forum/xhtml-html-css/)
-   -   Выпадающее меню. (https://javascript.ru/forum/xhtml-html-css/43899-vypadayushhee-menyu.html)

Терехов Станислав 25.12.2013 20:28

Выпадающее меню.
 
Всем привет. Как сделать выпадающее меню?

danik.js 25.12.2013 21:11

Очередной забаненый гуглом?

Терехов Станислав 25.12.2013 22:32

А может кто-нибудь показать, как создаётся всплывающее меню при наведении мышки только при помощи Div'ов, а не таблиц?

danik.js 25.12.2013 23:11

Специально для тебя накидал пример
<!DOCTYPE html>
<meta charset="utf-8" />
<style>
	.menu li{
		position: relative;
		display: inline-block;
		background: #777;
		list-style: none;
		padding: 2px 4px;
		margin: 2px;
	}
	.menu a{
		color: #fff;
		font-family: Arial;
		text-decoration: none;
	}
	.menu li ul{
		visibility: hidden;
		opacity: 0;
		position: absolute;
		top: 100%;
		left: 0;
		border: 1px solid #777;
		margin: 0;
		padding: 0;
		/*transition: visibility 0.5s, opacity 0.5s;*/
	}
	.menu li:hover ul{
		visibility: visible;
		opacity: 1;
	}
	.menu li li{
		display: block;
		white-space: nowrap;
	}
</style>

<ul class="menu">
	<li>
		<a href="#">Пункт 1</a>
		<ul>
			<li><a href="#">Подпункт 1</a></li>
			<li><a href="#">Подпункт 2</a></li>
		</ul>
	</li>
	<li>
		<a href="#">Пункт 2</a>
		<ul>
			<li><a href="#">Подпункт 1</a></li>
			<li><a href="#">Подпункт 2</a></li>
		</ul>
	</li>
</ul>


Хм, чета транзишн во фрейме не хочет работать в хроме. Закоментил.

Терехов Станислав 25.12.2013 23:23

Большое спасибо, но меня как раз интересует всплывающее меню, не с таблицами, а с дивами.
А так спасибо, конечно большое. в этом коде тоже буду разбираться.

danik.js 25.12.2013 23:45

Цитата:

Сообщение от Терехов Станислав
Большое спасибо, но меня как раз интересует всплывающее меню, не с таблицами, а с дивами.

Чет не пойму. Как оно должно вспывать? И причем тут таблицы-то? Их уже сто лет никто не использует в верстке (без надобности)

Терехов Станислав 26.12.2013 00:12

danik.js,
я имею ввиду ul и li

Терехов Станислав 26.12.2013 00:14

таблицы это tr и td, а что тогда такое ul и li. если мне память не изменяет, то это обычная колонка, тогда поняно. спасибо.

danik.js 26.12.2013 05:15

Цитата:

Сообщение от Терехов Станислав
если мне память не изменяет, то это обычная колонка

http://htmlbook.ru/html/ul

Поголовно используется для разметки меню.

Терехов Станислав 26.12.2013 06:14

да. я это проходил полтора года назад. есть ещё ol и li. подзабыл немного. я эти тэги путаю с таблицей.


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