Вертикальное меню

[krig]

Всем привет!
Работаю над созданием адаптивной версии своего сайта. Так как сайт простой, решил не использовать фреймворки, а написать код самостоятельно. Столкнулся со следующей проблемой - нигде не могу найти пример вертикального адаптивного выпадающего меню. То есть, образцов горизонтального выпадающего адаптивного меню очень много, а вертикального нет. В чем проблема с его созданием? Подскажите, или дайте пример.

 

[-master-]

а как оно должно адаптироваться?

 

[vital]

В чем проблема с его созданием?

В том что вы не понимаете сами чего хотите. Попробуйте нарисовать на картинке адаптацию вертикального меню. Если получится - покажите здесь.

 

[krig]

На больших экранах я хочу, чтобы меню располагалось слева. Подпункты меню должны выпадать вправо. На мобильных устройствах это меню должно превращаться в "аккордеон".

 

[vital]

[accordion=bcenter]
{slide=Вот }1{/slide}

{slide=Такой}2{/slide}

{slide=Аккордеон}3{/slide}
[/accordion]

Можно сделать только на яваскрипте. И адаптивная верстка вам поможет мало, но если сделать чуть попроще, то можно.
В Целом в чем проблема-то? Принцип же один-в-один как с вертикальным.
Где попытки реализации хоть? Я то подскажу, но не писать же вместо вас.

 

[krig]

Ну, в общем-то картина немного стала проясняться. Когда будет конкретная наработка, выложу.

 

[-master-]

Ссылка скрыта от гостей

тут без скрипта

 

[vital]

Ссылка скрыта от гостей

тут без скрипта

Но с # которые для меню как бы нафиг не нужны? Хотя хз.

 

[krig]

Нашел то, что мне нужно, здесь -

Ссылка скрыта от гостей

.
Теперь возникла другая проблема. При подключении fancybox меню перестает работать.
Вот код подключения меню:
<script src="js/jquery.js"></script>
<script src="js/collapse.js"></script>
<!-- jQuery -->
<script type="text/javascript" src="js/jquery-loader.js"></script>
<!-- SmartMenus jQuery plugin -->
<script type="text/javascript" src="js/jquery.smartmenus.js"></script>
<!-- SmartMenus jQuery init -->
<script type="text/javascript">
$(function() {
$('#main-menu').smartmenus({
mainMenuSubOffsetX: 1,
mainMenuSubOffsetY: -8,
subMenusSubOffsetX: 1,
subMenusSubOffsetY: -8
});
});
</script>
А вот код подключения fancybox:
<script type="text/javascript" src="video/fancybox/jquery-1.5.min.js"></script>
<script type="text/javascript" src="video/fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="video/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<link rel="stylesheet" type="text/css" href="video/fancybox/jquery.fancybox-1.3.4.css" media="screen" />
<script type="text/javascript">
$(document).ready(function(){
$("a.foto").fancybox({
'transitionIn' :'elastic',
'transitionOut' :'elastic',
'speedIn' :1000,
'speedOut' :1000
});
});
</script>
Когда отключаю jquery-1.5.min.js в коде fancybox, меню работает, а fancybox - нет. Посоветуйте, как устранить эту неполадку?

 

[-master-]

какую неполадку? ничего не видно, что к чему, кто знает этот fancybox ? спросите на сайте разработчика, или выкладывайте тут код чтобы смотреть

 

[krig]

Скачал и установил fancybox2 и проблема ушла. Старый fancybox не работал с новыми версиями jquery.