Наведите и целевая привязка не работает. Прокручивая страницу и все еще отмеченная на первой кнопке действия - PullRequest
0 голосов
/ 23 октября 2019

Я пытался создать простую привязку навигации. Однако текстовая кнопка не активна при нажатии на нее и при прокрутке страницы, кнопка не перемещается в соответствии с соответствующим разделом и все еще активна на главной странице (кнопка). Файл CSS и встроенный стиль также не работают должным образом. Возможно, некоторые jquery-файлы, которые я использую, прерывают созданный мной CSS. Извините, я совсем новичок в этом деле.

HTML

<nav class="navbar-menu">
    <div class="collapse navbar-collapse" id="navbar-collapse-1">
        <ul class="nav navbar-nav">
            <li class="active"><a href="#section1">Home</a></li>
            <li class="dropdown-holder"><a xhref="#section2">none</a>
                <ul class="sub-menu">
                    <li><a href="section2">Section 2</a></li>
                </ul>
            </li>
            <li><a href="#section3">Section 3</a></li>
        </ul>
     </div>
</nav>

<div id="section1">Section 1</div>
<div id="section2">Section 2</div>
<div id="section3">Section 3</div>

CSS

<style type="text/css">
    a:hover {background: #bd202e !important;}
    a:active {background: #bd202e !important;}
    a:visited {background: #bd202e !important;}
    a:focus {background: #bd202e !important;}
</style>

Скрипт

<script>
    $('.navbar-menu.nav navbar-nav li').click(function(e) {
    var $this = $(this);
    $this.siblings().removeClass('active');
    if (!$this.hasClass('active')) {
        $this.addClass('active');
         }
       e.preventDefault();
    });
</script>

ВотСценарий, который я использовал:

1. <script type="text/javascript" src="vendor/bootstrap/bootstrap.min.js"></script> --> This script is for the main header slider
2. <script src="css/assets/bootstrap/js/bootstrap.min.js"></script>--> This script is for the gallery slider

Обратите внимание, что я попробовал две версии jQuery и не могу определить проблему. Если я удаляю jQuery-файл № 2, якорь активной & hover работает. Но я не хотел удалять файл jQuery № 2, потому что он мне нужен для моего слайдера галереи.

Пожалуйста, просите вашей помощи.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...