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

Тема в разделе "Web-design и ваши работы", создана пользователем krig, 1 апр 2015.

  1. krig

    krig Member

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

    -master- Well-Known Member

    Регистрация:
    14 янв 2012
    Сообщения:
    629
    Симпатии:
    19
    а как оно должно адаптироваться?
     
  3. vital

    vital Больной Компом Детектед
    Команда форума Web Team

    Регистрация:
    29 янв 2006
    Сообщения:
    2.474
    Симпатии:
    27
    В том что вы не понимаете сами чего хотите. Попробуйте нарисовать на картинке адаптацию вертикального меню. Если получится - покажите здесь.
     
  4. krig

    krig Member

    Регистрация:
    29 окт 2010
    Сообщения:
    14
    Симпатии:
    0
    На больших экранах я хочу, чтобы меню располагалось слева. Подпункты меню должны выпадать вправо. На мобильных устройствах это меню должно превращаться в "аккордеон".
     
  5. vital

    vital Больной Компом Детектед
    Команда форума Web Team

    Регистрация:
    29 янв 2006
    Сообщения:
    2.474
    Симпатии:
    27
    [accordion=bcenter]
    {slide=Вот }1{/slide}

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

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

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

    krig Member

    Регистрация:
    29 окт 2010
    Сообщения:
    14
    Симпатии:
    0
    Ну, в общем-то картина немного стала проясняться. Когда будет конкретная наработка, выложу.
     
  7. -master-

    -master- Well-Known Member

    Регистрация:
    14 янв 2012
    Сообщения:
    629
    Симпатии:
    19
  8. vital

    vital Больной Компом Детектед
    Команда форума Web Team

    Регистрация:
    29 янв 2006
    Сообщения:
    2.474
    Симпатии:
    27
    Но с # которые для меню как бы нафиг не нужны? Хотя хз.
     
  9. krig

    krig Member

    Регистрация:
    29 окт 2010
    Сообщения:
    14
    Симпатии:
    0
    Нашел то, что мне нужно, здесь - http://www.smartmenus.org/.
    Теперь возникла другая проблема. При подключении 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 - нет. Посоветуйте, как устранить эту неполадку?
     
  10. -master-

    -master- Well-Known Member

    Регистрация:
    14 янв 2012
    Сообщения:
    629
    Симпатии:
    19
    какую неполадку? ничего не видно, что к чему, кто знает этот fancybox ? спросите на сайте разработчика, или выкладывайте тут код чтобы смотреть
     
  11. krig

    krig Member

    Регистрация:
    29 окт 2010
    Сообщения:
    14
    Симпатии:
    0
    Скачал и установил fancybox2 и проблема ушла. Старый fancybox не работал с новыми версиями jquery.
     
Загрузка...

Поделиться этой страницей