Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Горизонтальное выпадающее меню на jQuery (https://javascript.ru/forum/jquery/12524-gorizontalnoe-vypadayushhee-menyu-na-jquery.html)

hrundel 21.10.2010 18:08

Горизонтальное выпадающее меню на jQuery
 
Не известен ли бесплатный аналог вот такого прекрасного меню?
http://javascript-array.com/scripts/...p_down_menu/?j

sysya 21.10.2010 18:30

Аналогов много, есть и лучше... гугл, яндекс вам в помощь. А на этом сайте разве не бесплатно код на виду, копировать - вставить...

monolithed 21.10.2010 18:52

Цитата:

Сообщение от hrundel
Не известен ли бесплатный аналог вот такого прекрасного меню?

А чем этот не бесплатный?;)

hrundel 22.10.2010 18:54

Внизу есть ссылка на сайт разработчика, где предлагают купить. А на самой странице меню вроде даже ajax'ом подгружается

hrundel 22.10.2010 18:57

Цитата:

Сообщение от monolithed (Сообщение 75302)
А чем этот не бесплатный?;)

Ты его попробуй разбери сначала, чтобы себе на страницу поставить. Разработчики код запутали...

sysya 22.10.2010 20:12

Ну что тут платного, это легко делается собственноручно :)
А ещё есть поисковики, второй раз намекаю, много примеров есть в сети...
Скопируйте название этой темы, в строку поисковика, в браузере которым вы пользуетесь, вставьте, нажмите энтер...

NeoMurderer 07.04.2011 16:17

Всего лиш смена opacyti при наведении,ничего особенного

poorking 07.04.2011 16:52

я бы сделал так
<!DOCTYPE html>
<style type = "text/css">
*{
	margin:0px;
	padding:0px;
	font-family:helvetica, arial, sans-serif;
	font-size:14px;
}
.menu, .menu ul{
	color:#fff;
	list-style-type: none;
}

.menu > li{
	position:relative;
	width: 100px;
	display: inline-block;
	margin-right:-4px;
	cursor: pointer;
}
.menu > li > div{
	line-height: 30px;
	padding:0px 10px;
	background-color: red;
	background-color: #5af;
	border-bottom: 3px solid white;
}
.menu > li > ul > li{
	width: 80px;
	padding:0px 10px;
	cursor: pointer;
	line-height: 30px;
	border-bottom: 1px solid white;
	
}
.menu > li > ul{
	position:absolute;
	top:33px;
	left:0px;
	height:0px;
	overflow:hidden;
	background-color: transparent;
	
	-webkit-transition: all 0.5s linear;
	-moz-transition: all 0.5s linear;
	-ms-transition: all 0.5s linear;
	-o-transition: all 0.5s linear;
	transition: all 0.5s linear;
	opacity: 0;
}
.menu > li:hover ul{
	
	height: 155px;
	opacity: 1;
	background-color: #5af;
}
.menu > li:hover >div{
	background-color: #05a;
}
</style>
<ul class = "menu">
	<li><div>item1&nbsp;▼</div>
		<ul>
			<li>sub0</li>
			<li>sub1</li>
			<li>sub2</li>
			<li>sub3</li>
			<li>sub4</li>
		</ul>
	</li>
	<li><div>item2&nbsp;▼</div>
		<ul>
			<li>sub0</li>
			<li>sub1</li>
			<li>sub2</li>
			<li>sub3</li>
			<li>sub4</li>
		</ul>
	</li>
	<li><div>item3&nbsp;▼</div>
		<ul>
			<li>sub0</li>
			<li>sub1</li>
			<li>sub2</li>
			<li>sub3</li>
			<li>sub4</li>
		</ul>
	</li>
</ul>
привет!

а там где не работает еще transition просто не будет анимации, я не думаю что эти штуки критичны в дизайне, Обычно наоборот отвлекают, так что не стал бы сходить с ума от всех этих лишних скриптов. И посмотрите как это просто. Во всех новых браузерах уже работает transition, кроме ie

PS я тут в стилях накуралесил наспех, кучу всего объединить можно и будет совсем просто

0931454574 07.04.2011 17:36

Чувак, если не учитывать старые версии ie , то можно обойтись и без квери, а просто на css , а если хочется програмным кодом потешиться то найди аналог простого меню и уже от него пляши. А в чем конкретно цель , какое меню нужно?

В помощь http://anton.shevchuk.name/javascrip...r-beginners-2/


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