sidebar не является функцией ошибки

Я пытаюсь получить самый простой пример боковой панели, используя примеры из here. Вот мой HTML:sidebar не является функцией ошибки

<!DOCTYPE HTML> 
<html> 
    <head> 
    <link rel="stylesheet" type="text/css" href="./css/sidebar.min.css" /> 
    <script type="text/javascript" src="./css/sidebar.min.js"></script> 
    </head> 
    <body> 
    <div class="ui right vertical menu sidebar"> 
    <div class="item">foo</div> 
    <div class="item">bar</div> 
    </div> 
    <div class="pusher"> 
    Your site's actual content 
    </div> 
</body> 
</html>

Это не показывает боковой панели; когда я печатаю $('.ui.sidebar').sidebar('toggle') в консоль разработчика я получаю эту ошибку:

VM387:2 Uncaught TypeError: $(...).sidebar is not a function(…)

Использования Chrome 49 на Windows 8.

Как получить боковую панель, чтобы правильно показать?

источник

2016-03-16 Nate Glenn

Во-первых, на вкладке сети вы получаете код состояния 200 OK из файла js боковой панели? –

Plz проверить путь js файл включен. Вы уверены, что он находится в папке css? –

@BenSewards да, ресурсы загружаются правильно. –

Помимо того, что я не использовал jquery сначала как зависимость, как указано в комментариях, я бы не предложил использовать этот плагин, учитывая его текущее состояние, отсутствие документации и невозможность использования без определенных внешних ресурсов. Вот рабочий пример jsfiddle ниже построен на демо-сайте:

https://jsfiddle.net/1cthL39a/8/

HTML

<div class="wrapper jsc-sidebar-content jsc-sidebar-pulled"> 
    <nav> 
     <a href="#" class="icon-menu link-menu jsc-sidebar-trigger"></a> 
    </nav> 
    <section class="main-content"> 
     <div class="main-content-header"> 
      <h1 class="headline"><span class="headline-main">Sidebar</span>JS</h1> 
      <p class="version">v 0.2.0</p> 
      <p>SidebarJS is a jQuery plugin for side navigation.</p> 
      <ul class="btn-list"> 
       <li><a href="http://github.com/makotot/sidebar" class="btn">View on Github</a></li> 
       <li><a href="http://github.com/makotot/sidebar/releases/0.2.0" class="btn">Download</a></li> 
      </ul> 
     </div> 
     <div class="main-content-body"> 
      <div class="main-content-body-inner"> 
       <h2>Public API</h2> 
       <ul> 
        <li> 
         <h3>.push()</h3> 
         <p><a href="#" id="api-push">Open</a> Sidebar content from JavaScript.</p> 
        </li> 
        <li> 
         <h3>.pull()</h3> 
         <p><a href="#" id="api-pull">Close</a> Sidebar content from JavaScript.</p> 
        </li> 
       </ul> 
      </div> 
     </div> 
    </section> 

</div> 

     <nav class="sidebar jsc-sidebar" id="jsi-nav" data-sidebar-options=""> 
    <ul class="sidebar-list"> 
     <li><a href="./" class="current">SidebarJS</a></li> 
     <li><a href="http://github.com/makotot/sidebar/">View on Github</a></li> 
     <li><a href="http://github.com/makotot/sidebar/releases">Download</a></li> 
    </ul> 
</nav>

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

источник

2016-03-16 02:56:45

Я не думаю, что вы используете ту же библиотеку, что и я. Я использую боковую панель Semantic UI, и вы используете плагин боковой панели JQuery. –

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

sidebar не является функцией ошибки

ответ

Смежные вопросы