Горизонтальное выпадающее меню на jQuery
Не известен ли бесплатный аналог вот такого прекрасного меню?
http://javascript-array.com/scripts/...p_down_menu/?j |
Аналогов много, есть и лучше... гугл, яндекс вам в помощь. А на этом сайте разве не бесплатно код на виду, копировать - вставить...
|
Цитата:
|
Внизу есть ссылка на сайт разработчика, где предлагают купить. А на самой странице меню вроде даже ajax'ом подгружается
|
Цитата:
|
Ну что тут платного, это легко делается собственноручно :)
А ещё есть поисковики, второй раз намекаю, много примеров есть в сети... Скопируйте название этой темы, в строку поисковика, в браузере которым вы пользуетесь, вставьте, нажмите энтер... |
Всего лиш смена opacyti при наведении,ничего особенного
|
я бы сделал так
<!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 ▼</div>
<ul>
<li>sub0</li>
<li>sub1</li>
<li>sub2</li>
<li>sub3</li>
<li>sub4</li>
</ul>
</li>
<li><div>item2 ▼</div>
<ul>
<li>sub0</li>
<li>sub1</li>
<li>sub2</li>
<li>sub3</li>
<li>sub4</li>
</ul>
</li>
<li><div>item3 ▼</div>
<ul>
<li>sub0</li>
<li>sub1</li>
<li>sub2</li>
<li>sub3</li>
<li>sub4</li>
</ul>
</li>
</ul>
привет!
а там где не работает еще transition просто не будет анимации, я не думаю что эти штуки критичны в дизайне, Обычно наоборот отвлекают, так что не стал бы сходить с ума от всех этих лишних скриптов. И посмотрите как это просто. Во всех новых браузерах уже работает transition, кроме ie PS я тут в стилях накуралесил наспех, кучу всего объединить можно и будет совсем просто |
Чувак, если не учитывать старые версии ie , то можно обойтись и без квери, а просто на css , а если хочется програмным кодом потешиться то найди аналог простого меню и уже от него пляши. А в чем конкретно цель , какое меню нужно?
В помощь http://anton.shevchuk.name/javascrip...r-beginners-2/ |
| Часовой пояс GMT +3, время: 04:23. |