@Aksel__Shelter

Почему не работет скрипт на jQuery?

Привет.
Пишу выпадающее меню для своего сайта( пока учусь еще, опыта немного), но делаю сразу на xampp( если это важно). Проблема моя в том, что js скрипт не работает, с остальным все ок. Я по-разному подключал jQuery и мой личный файл с js, но скрину сейчашний вариант.
Код
Это html:
<!DOCTYPE HTML>
<html>
<head>
   <meta charset="UTF-8"/>
<link  href="menushechka.css" type="text/css"  rel="stylesheet" />
<script type="text/javascript" src="node_modules/jquery/dist/jquery.min.js"></script>
<script type="text/javasript" src="menushechka.js" ></script>
    <title>Навигация</title>
</head>
<body>
    <nav>

      <ul id="ddmenu">

        <li><a href="#">Главная</a></li>

        <li><a href="#">О нас</a>

          <ul>
<li><a href="#">Миссия</a></li>

            <li><a href="#">Команда</a></li>

            <li><a href="#">История</a></li>

          </ul>

        </li>

        <li><a href="#">Продукты</a>

          <ul>

            <li><a href="#">Логитипы</a></li>

            <li><a href="#">Шаблоны</a></li>

           <li><a href="#">Иконки</a></li>
<li><a href="#">Плагины jQuery</a></li>

            <li><a href="#">маркетинг Internet</a></li>

          </ul>

        </li>

        <li><a href="#">Интернационализация</a>
          <ul>

            <li><a href="#">Китай</a></li>
            <li><a href="#">Япония</a></li>

            <li><a href="#">Канада</a></li>

            <li><a href="#">Автсралия</a></li>

            <li><a href="#">Южная Америка</a></li>
 </ul>

        </li>

        <li><a href="#">Контакты</a></li>

      </ul>

    </nav>

</body>
</html>


Мой css:
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {

  margin: 0;

  padding: 0;

  border: 0;

  font-size: 100%;
  font: inherit;

  vertical-align: baseline;

  outline: none;

  -webkit-font-smoothing: antialiased;

  -webkit-text-size-adjust: 100%;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

}

html { height: 101%; }

body { background: #eaeaea url('images/bg.png'); font-size: 62.5%; line-height: 1; font-family: Arial, Tahoma, sans-serif; padding-bottom: 60px; }

 

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

ol, ul { list-style: none; }

 
blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

strong { font-weight: bold; }
 

table { border-collapse: collapse; border-spacing: 0; }

img { border: 0; max-width: 100%; }
#ddmenu {
  display: block;

  width: 100%;

  height: 80px;

  margin: 0 auto;

  padding: 0 15px;

  background: #fff;

  border-radius: 6px;

  border: 1px solid rgba(0, 0, 0, 0.15);

  box-shadow: 0 1px 1px rgba(20, 20, 20, 0.2);

  cursor: pointer;

  outline: none;

  font-weight: bold;

  color: #8aa8bd;

}

 

#ddmenu li { display: block; position: relative; float: left; font-size: 1.45em; text-shadow: 1px 1px 0 #fff; border-right: 1px solid #dae0e5; }

 

#ddmenu li a {

  display: block;

  float: left;

  padding: 0 12px;

  line-height: 78px;

  font-weight: bold;

  text-decoration: none;

  color: #6c87c0;

  -webkit-transition: all 0.2s linear;

  -moz-transition: all 0.2s linear;

  -o-transition: all 0.2s linear;

  transitio: all 0.2s linear;

}

#ddmenu li:hover > a { color: #7180a0; background: #d9e2ee; }

 

#ddmenu ul {

  position: absolute;

  top: 88px;

  width: 130px;

  background: #fff;
  display: none;

  margin: 0;

  padding: 7px 0;

  list-style: none;

  border-radius: 3px;

  border: 1px solid rgba(0, 0, 0, 0.2);

  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);

}
#ddmenu ul:after {

  content: "";

  width: 0;

  height: 0;

  position: absolute;

  bottom: 100%;

  left: 8px;

  border-width: 0 8px 8px 8px;

  border-style: solid;

  border-color: #fff transparent;

}

 

#ddmenu ul:before {

  content: "";

  width: 0;

  height: 0;

  position: absolute;

  bottom: 100%;

  left: 4px;

  border-width: 0 10px 10px 10px;

  border-style: solid;

  border-color: rgba(0, 0, 0, 0.1) transparent; 

}

 

#ddmenu ul li {

  display: block;

  width: 100%;

  font-size: 0.9em;
  text-shadow: 1px 1px 0 #fff;

}

 
#ddmenu ul li a {

  display: block;

  width: 100%;

  padding: 6px 7px;

  line-height: 1.4em;

  -webkit-transition: all 0.2s linear;

  -moz-transition: all 0.2s linear;

  -o-transition: all 0.2s linear;

  transition: all 0.2s linear;

}

#ddmenu ul li a:hover {

  background: #e9edf3;

}



$(document).ready(function(){
  $('a').on('click', function(e){
    e.preventDefault();
  });
  $('#ddmenu li').hover(function () {
     clearTimeout($.data(this,'timer'));
     $('ul',this).stop(true,true).slideDown(200);
  }, function () {
    $.data(this,'timer', setTimeout($.proxy(function() {
      $('ul',this).stop(true,true).slideUp(200);
    }, this), 100));
  });
});


P.S.: путь до jQuery я указал, согласно официальному сайту. Цитирую:"This will install jQuery in the node_modules directory. Within node_modules/jquery/dist/ you will find an uncompressed release, a compressed release, and a map file." Указал тот , что compressed.
  • Вопрос задан
  • 129 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы