выпадающее меню fullPage.js - PullRequest
Новая
       27

выпадающее меню fullPage.js

0 голосов
/ 05 марта 2019

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

Когда я пытаюсь нажать / нажать на кнопку, она ничего не делает (ничего не падает). 

<link rel="stylesheet" type="text/css" href="lib/css/bootstrap.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>

А вот и меню. 

<ul id="menu">
      <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown<span class="caret"></span></a>
        <ul class="dropdown-menu">
          <li><a href="#">Option 1</a></li>
          <li><a href="#">Option 2</a></li>
        </ul>
      </li>
</ul>

Я действительно новичок в этом, так что, вероятно, это простая проблема, но я все еще не могу понять это.

Также, если есть более простое решение или без начальной загрузки, я хотел бы попробовать их все.

Ответы [ 2 ]

1 голос
/ 06 марта 2019

После долгих поисков и поисков, я нашел способ сделать то, что я хочу.

Вы должны использовать Bootstrap.css, Bootstrap.js, jQuery.js и Popper.js.

Также вы должны установить crossorigin="anonymous"

<script type="text/javascript" src="lib/js/jquery-3.3.1.js" crossorigin="anonymous"></script>
<script type="text/javascript" src="lib/js/popper-1.14.7.js" crossorigin="anonymous"></script>
<script type="text/javascript" src="lib/js/bootstrap-4.3.1.js" crossorigin="anonymous"></script>

Также об использовании скриптов Java вы можете использовать его следующим образом: (как указано здесь - сайт начальной загрузки ) 

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>

Вот меню: 

<ul id="menu">
    <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown<span class="caret"></span></a>
        <ul class="dropdown-menu">
            <li><a href="#">Option 1</a></li>
            <li><a href="#">Option 2</a></li>
        </ul>
    </li>
</ul>

Надеюсь, это поможет некоторым людям, потому что я нашел пару вопросов, похожих на мои.

0 голосов
/ 07 марта 2019

Я создал пример скрипта, используя bootstrap js и bootsrap css аналогично, учитывая ваш код, и я также добавил fullpage js, но раскрывающийся список работает нормально.

Пожалуйста, отметьте здесь .работает нормально.Файл JS и Css. 

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript" src="https://cdnjs.com/libraries/fullPage.js"></script>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<ul id="menu">
      <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown<span class="caret"></span></a>
        <ul class="dropdown-menu">
          <li><a href="#">Option 1</a></li>
          <li><a href="#">Option 2</a></li>
        </ul>
      </li>
</ul>
...