• Познакомьтесь с пентестом веб-приложений на практике в нашем новом бесплатном курсе

    «Анализ защищенности веб-приложений»

    🔥 Записаться бесплатно!

  • CTF с учебными материалами Codeby Games

    Обучение кибербезопасности в игровой форме. Более 200 заданий по Active Directory, OSINT, PWN, Веб, Стеганографии, Реверс-инжинирингу, Форензике и Криптографии. Школа CTF с бесплатными курсами по всем категориям.

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

  • Автор темы krig
  • Дата начала
K

krig

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

-master-

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

krig

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

vital

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

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

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

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

krig

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

-master-

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

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 - нет. Посоветуйте, как устранить эту неполадку?
 
M

-master-

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

krig

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

Обучение наступательной кибербезопасности в игровой форме. Начать игру!