Выпадающее меню на mootools
Идет работа над шаблоном summ (это порт бесплатного шаблона summ(wordpress) для livestreet)
картинку прилагаю:
прошу немного помочь:
сейчас меню имеет вид:
Но при тестировании столкнился с тем, что при включении нескольких плагинов (меню увеличивается) такая конструкция само собой не помещается => решил сделать выпадающее меню на mootools.
есть скрипт:
он функционирует при такой структуре меню:
Но изменять структуру меню не хочется, так как потом при включении плагинов в самих плагинах предется править менюшки (а мы же за унификацию).
Помогите исправить скрипт mootools, чтобы он работал со стандартным меню.
кстати css менюхи: (чтобы могли посмотреть что надо получить)
картинку прилагаю:
прошу немного помочь:
сейчас меню имеет вид:
Но при тестировании столкнился с тем, что при включении нескольких плагинов (меню увеличивается) такая конструкция само собой не помещается => решил сделать выпадающее меню на mootools.
есть скрипт:
window.addEvent('domready', function(){
$('drop_down_menu').getElements('li.menu').each( function( elem ){
var list = elem.getElement('ul.links');
var myFx = new Fx.Slide(list).hide();
elem.addEvents({
'mouseenter' : function(){
myFx.cancel();
myFx.slideIn();
},
'mouseleave' : function(){
myFx.cancel();
myFx.slideOut();
}
});
})
});
он функционирует при такой структуре меню:
<div id="menu-container">
<ul id="drop_down_menu">
<li class="menu">Menu 1
<ul class="links">
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a></li>
</ul>
</li>
<li class="menu">Menu 2
<ul class="links">
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a></li>
<li><a href="#">Link 3</a></li>
</ul>
</li>
</ul>
</div>
Но изменять структуру меню не хочется, так как потом при включении плагинов в самих плагинах предется править менюшки (а мы же за унификацию).
Помогите исправить скрипт mootools, чтобы он работал со стандартным меню.
кстати css менюхи: (чтобы могли посмотреть что надо получить)
#menu-container {
display:block;
position:relative;
width:700px;
margin:0px auto 0px;
font-size:11px;
}
#drop_down_menu {
display:block;
position:absolute;
clear:both;
margin:0px;
padding:0px;
text-align:left;
list-style-type:none;
text-align:center;
width:700px;
float:none;
left:0px;
top:0px;
}
#drop_down_menu li {
font-size:12px;
font-weight:bold;
float:left;
color:#11a2db;
padding:5px;
cursor:pointer;
background:#333333;
width:150px;
}
#drop_down_menu li ul {
margin:0px;
padding:0px;
list-style-type:none;
padding-top:10px;
}
#drop_down_menu li ul li {
display:block;
float:none;
clear:both;
}
#drop_down_menu li ul li a {
color:#FFFFFF;
font-weight:normal;
text-decoration:none;
display:block;
}
4 комментария
Но позвольте узнать, этот шаблон что на скрине доступен где либо?