2017-01-17 1 views
0

Я пытаюсь создать меню выпадающего меню, но netbeans продолжает говорить, что синтаксис неверен.Выдвинутое меню не работает, NetBeans продолжает показывать синтаксическую ошибку.

консоль отображает: ReferenceError: Jquery не определен [больше_инфо] navbar.js: 16: 1

выше файл находится в PHP файл меню, который я включил на каждой странице.

Невозможно найти место ошибки.

$(document).ready(function(){ 
 
    $(".fa-times").click(funtion(){ 
 
     $(".sidebar_menu").addClass("hide_menu"); 
 
     $(".toggle_menu").addClass("opacity_one"); 
 
     
 
      });  
 
      $(".toggle_menu").click(funtion(){ 
 
     $(".sidebar_menu").removeClass("hide_menu"); 
 
     $(".toggle_menu").removeClass("opacity_one"); 
 
       
 
      }); 
 
});
/* menu 2 */ 
 
.toggle_menu{ 
 
    position:fixed; 
 
    padding: 15px 20px 15px 15px; 
 
    margin-top: 70px; 
 
    color:white; 
 
    cursor: pointer; 
 
    background-color:#648b79; 
 
    z-index:1000000; 
 
    font-size:2em; 
 
    opacity:0; 
 
} 
 
.sidebar_menu{ 
 
    position:fixed; 
 
    width:250px; 
 
    margin-left:0px; 
 
    overflow:hidden; 
 
    height:100vh; 
 
    max-height:100vh; 
 
    background-color: rgba(17, 17, 17, 0.9); 
 
    opacity:0.9; 
 
    transition: all 0.3s ease-in-out;  
 
} 
 
.fa-times{ 
 
    right:10px; 
 
    top:10px; 
 
    opacity:0.7; 
 
    cursor: pointer; 
 
    position:absolute; 
 
    color:white; 
 
    transition: all 0.3s ease-in-out;  
 
} 
 
.fa-times:hover{ 
 
    opacity:1; 
 
} 
 
.boxed_item{ 
 
    font-family: 'Open Sans'; 
 
    font-weight: 200; 
 
    padding: 10px 20px; 
 
    display:inline-block; 
 
    border: solid 2px white; 
 
    box-sizing: border-box; 
 
    font-size: 22px; 
 
    color:white; 
 
    text-align:center; 
 
    margin-top:70px;  
 
} 
 
.logo_bold{ 
 
    font-weight: 800; 
 
} 
 
.logo_title{ 
 
    color:white; 
 
    font-family: 'Open Sans'; 
 
    font-weight: 200; 
 
    font-size: 12px; 
 
    text-align: center; 
 
    padding: 5px 0; 
 
} 
 
.navigation_selection{ 
 
    margin: 20px 0; 
 
    display:block; 
 
    width:200px; 
 
    margin-left: 25px; 
 
} 
 
.navigation_item{ 
 
    font-weight: 200; 
 
    font-family: 'Open Sans'; 
 
    color:white; 
 
    padding: 12px 0; 
 
    box-sizing:border-box; 
 
    font-size: 14px; 
 
    color:#D8D8D8; 
 
    border-bottom: solid 1px #d8d8d8; 
 
    transition: all 0.3s ease-in-out; 
 
    cursor:pointer; 
 
} 
 
.boxed_item_smaller{ 
 
    font-size: 12px; 
 
    color:#D8D8D8; 
 
    width:200px; 
 
    transition: all 0.3s ease-in-out; 
 
cursor: pointer; 
 
border-width:1px; 
 
margin:0 0 20px 0; 
 
} 
 
.boxed_item_smaller:hover{ 
 
background-color:white; 
 
color:#111; 
 
    transition: all 0.3s ease-in-out; 
 
} 
 
.hide_menu{ 
 
    margin-left:-250px; 
 
} 
 
.opacity_one{ 
 
    opacity:1; 
 
    transition: all 0.3s ease-in-out; 
 
}
<html> 
 
<head> 
 
<meta charset="UTF-8"> 
 
<link rel="stylesheet" href="style.css" type="text/css"> 
 
<script src="scriptsm.js"></script> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"> 
 
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
 
</head> 
 

 
<body> 
 
<i class="fa fa-bars toggle_menu"></i> 
 
    <div class="sidebar_menu"> 
 
     <i class="fa fa-times"></i> 
 
\t \t \t <center> 
 
\t \t \t \t <a href="#"><h1 class="boxed_item">robby<span class="logo_bold">test</span></h1></a> 
 
\t \t \t \t <h2 class="logo_title">test</h2> 
 
\t \t \t </center> 
 
     
 
     <ul class="navigation_selection"> 
 
      <li class="navigation_item"> ? </li> 
 
      <li class="navigation_item"> ? </li> 
 
      <li class="navigation_item"> ? </li> 
 
      <li class="navigation_item"> ? </li> 
 
      <li class="navigation_item"> ? </li> 
 
      <li class="navigation_item"> ? </li> 
 
     </ul> 
 
\t \t \t <center> 
 
\t \t \t \t <a href="#"><h1 class="boxed_item boxed_item_smaller"> 
 
       <i class="fa fa-user"></i>??</h1></a> 
 
\t \t \t </center> 
 
    </div> 
 
</body> 
 
</html>

ответ

1

Ваш HTML неверен Вот почему JQuery не загружен.

вам не хватает> после того, как атрибут Src в тег сценария

<script src="http://code.jquery.com/jquery-1.10.1.min.js"</script> 

должно быть

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 

второй вопрос является неправильным написание функции в замковое событий. Это должно быть

$(document).ready(function() { 
    $(".fa-times").click(function() { 
    $(".sidebar_menu").addClass("hide_menu"); 
    $(".toggle_menu").addClass("opacity_one"); 

    }); 
    $(".toggle_menu").click(function() { 
    $(".sidebar_menu").removeClass("hide_menu"); 
    $(".toggle_menu").removeClass("opacity_one"); 
    }); 
}); 
+0

спасибо, что это должно быть от копирования, но оно все еще не работает. –

+0

@RobbyMorales проверяет обновление. функция события события была пропущена. после этой коррекции он будет работать отлично. – Deep

+0

@RobbyMorales проблема решена? – Deep

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