Member 13871291 Ответов: 1

Почему моя навигационная ссылка не работает, когда я хочу перейти на главную страницу выпадающего меню?


Когда я пытаюсь нажать кнопку "продукты" (навигационная панель, например: главная страница | продукты | о компании | Контакт), она на самом деле не ссылается на страницу продуктов, а просто действует как точка наведения, поэтому появляется выпадающее меню "крупный рогатый скот" и "сено". Я все еще хотел бы, чтобы там была общая страница продукта, а затем и конкретные страницы из выпадающего меню.

Вот мой код, Пожалуйста, помогите!

<li class="nav-item dropdown">
                <a class="nav-link active dropdown-toggle" href="products.html" id="dropdown04" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Products</a>
                <div class="dropdown-menu" aria-labelledby="dropdown04">
                  <a class="dropdown-item" href="cattle.html">Cattle</a>
                  <a class="dropdown-item" href="hay.html">Hay</a>
                  </div>
              </li>


Что я уже пробовал:

Я пытался изменить тег класса <a, но не знаю, что делать.

1 Ответов

Рейтинг:
2

Richard Deeming

Добавление data-toggle="dropdown" переход по ссылке гарантирует, что выпадающее меню появится при нажатии на ссылку. Это не позволяет браузеру перейти по ссылке, так как это помешает вам увидеть выпадающее меню.

Самое простое решение-добавить ссылку и в выпадающее меню:

<li class="nav-item dropdown">
    <a class="nav-link active dropdown-toggle" href="products.html" id="dropdown04" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Products</a>
    <div class="dropdown-menu" aria-labelledby="dropdown04">
        <a class="dropdown-item" href="products.html">All products</a>
        <a class="dropdown-item" href="cattle.html">Cattle</a>
        <a class="dropdown-item" href="hay.html">Hay</a>
    </div>
</li>