COVID2019 и это вот все. Друзья, вся эта история начинает плохо пахнет. Мойте руки, не ходите в люди. Отложите все плановые покупки и положите в носок заначку. Заприте ваших родителей, бабушек-дедушек на даче. Лучше перебдеть чем недобдеть. Берегите себя!

Как сделать активным главный пункт меню?


AlexDev

Recommended Posts

Стандартный шаблон оспро 2.3

Чтобы перейти в каталог, надо выбрать последний пункт меню "смотреть все..."

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

Ссылка стоит, но почему-то не нажимается

 

пока что понял, что дело в этом: data-toggle="dropdown"

но я ничего не понимаю в бутстрапе, всегда верстал обычным css+html. Как правильно поправить, чтобы не сломать ничего?

Ссылка на комментарий
Поделиться на других сайтах

3 часа назад, AlexDev сказал:

пока что понял, что дело в этом: data-toggle="dropdown"

Абсолютно верное направление мысли.

При этом если просто вырезать data-toggle="dropdown", то в десктоп-варианте всё будет как вы хотите, но в мобильном виде это меню раскрываться не будет (до подкатегорий).

Ссылка на комментарий
Поделиться на других сайтах

2 часа назад, Nickbur сказал:

Абсолютно верное направление мысли.

При этом если просто вырезать data-toggle="dropdown", то в десктоп-варианте всё будет как вы хотите, но в мобильном виде это меню раскрываться не будет (до подкатегорий).

И как быть?

Ссылка на комментарий
Поделиться на других сайтах

Если  сделать активной ссылку на главную категорию и одновременно убрать выпадающее подменю в Главном меню на большом экране, но сохранить на малых, то что-то типа этого:

Скрытый текст

<nav id="menu" class="navbar">
    <div class="navbar-header"><span id="category" class="visible-xs"><?php echo $text_category; ?></span>
      <button type="button" class="btn btn-navbar navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse"><i class="fa fa-bars"></i></button>
    </div>
    <div class="collapse navbar-collapse navbar-ex1-collapse">
      <ul class="nav navbar-nav">
        <?php foreach ($categories as $category) { ?>
        <?php if ($category['children']) { ?>
        <li class="visible-lg"><a href="<?php echo $category['href']; ?>"><?php echo $category['name']; ?></a></li>
        <li class="dropdown hidden-lg"><a href="<?php echo $category['href']; ?>" class="dropdown-toggle" data-toggle="dropdown"><?php echo $category['name']; ?></a>
          <div class="dropdown-menu hidden-lg">
            <div class="dropdown-inner">
              <?php foreach (array_chunk($category['children'], ceil(count($category['children']) / $category['column'])) as $children) { ?>
              <ul class="list-unstyled">
                <?php foreach ($children as $child) { ?>
                <li><a href="<?php echo $child['href']; ?>"><?php echo $child['name']; ?></a></li>
                <?php } ?>
              </ul>
              <?php } ?>
            </div>
            <a href="<?php echo $category['href']; ?>" class="see-all"><?php echo $text_all; ?> <?php echo $category['name']; ?></a> </div>
        </li>
        <?php } else { ?>
        <li><a href="<?php echo $category['href']; ?>"><?php echo $category['name']; ?></a></li>
        <?php } ?>
        <?php } ?>
      </ul>
    </div>
  </nav>

Правки выделены жирным шрифтом( код сырой, наброски)

Добавляем прямую ссылку на главную категорию только на большие экраны ( там можно играться со стилями- где скрывать, где показывать: visible-md, hidden-md)

Скрываем выпадающий блок для большого экрана, но оставляем для малых экранов, т.к. там это-основная навигация.

В целом получается главное меню посимпатичнее. НО добавляется лишний клик для входа в подкатегорию.

Как сделать, чтобы и сохранить выпадающий блок везде и сделать активной ссылкой название главной категории- пока не соображу.

Ссылка на комментарий
Поделиться на других сайтах

19 часов назад, AlexDev сказал:

И как быть?

Иногда собственный велосипед предпочтительнее использования фреймворка. Я бы сверстал собственное меню с нужным мне функционалом.

Ссылка на комментарий
Поделиться на других сайтах

  • 1 month later...

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Гость
Ответить в тему...

×   Вы вставили отформатированное содержимое.   Удалить форматирование

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Сейчас на странице   0 пользователей

    • Нет пользователей, просматривающих эту страницу