jquery not working script

Question

hi all im kinda new to jquery and i have no idea why my script aint working could you please help me out.i have tryed

script src="text/javascript scipt src='jquery-ui/jquery.min.js and jquery-ui.min.js

dont know if it is necessary tho. .

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Store Home</title>
<!--Bootstrap-->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<!--Bootstrap-->
<script type="text/javascript"></script>
 <script>
 $(document).ready(function() {
    $('#searchbox').hide();
$('#search').mouseOver(function() {
    $('#searchbox').slideToggle(400);
});// end mouseover
 });// end ready
 </script>
</head>
<body>
<nav class="navbar navbar-default">
  <div class="container-fluid">
    <div class="navbar-header">

    </div>
    <div>
      <ul class="nav navbar-nav" id="navbar">
        <li><a href="#" id="log">Login/Register</a></li>
        <li><a href="#" id="home">Home</a></li>
        <li><a href="#" id="search">Search</a></li>
        <li><a href="#" id="store">Store</a></li>
        <li><a href="#" id="about">About</a></li>

      </ul>
    </div>
  </div>
</nav>
 <img src="http://www.unixstickers.com/image/cache/data/stickers/meme/gentleman/Gentleman.sh-600x600.png" href="#" id="logo">

 <div id="searchbox"></div>
    <form class="searchbox" action="">
        <input type="search" placeholder="Search" />

    </form>

</body>
</html>

You haven't included jquery.js in your page, only bootstrap.js. Add a reference to jQuery, and ensure you put if before Bootstrap, and your code should work. If not, check the console for other errors. — Rory McCrossan
– Rory McCrossan, Commented Aug 9, 2015 at 22:21
You need to add jquery library to your document. you can use this link to host jquery library. — Romnick Susa
– Romnick Susa, Commented Aug 9, 2015 at 22:31

KAD · Accepted Answer · 2015-08-09 22:45:27Z

You need to link you jquery script same as the code below, besides, jquery is case sensitive so use mouseover instead of mouseOver

$(document).ready(function() {
    $('#searchbox').hide();
$('#search').mouseover(function() {
    $('#searchbox').slideToggle(400);
});// end mouseover
 });// end ready

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Store Home</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<!--Bootstrap-->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<!--Bootstrap-->
<script type="text/javascript"></script>
 <script>
 
 </script>
</head>
<body>
<nav class="navbar navbar-default">
  <div class="container-fluid">
    <div class="navbar-header">

    </div>
    <div>
      <ul class="nav navbar-nav" id="navbar">
        <li><a href="#" id="log">Login/Register</a></li>
        <li><a href="#" id="home">Home</a></li>
        <li><a href="#" id="search">Search</a></li>
        <li><a href="#" id="store">Store</a></li>
        <li><a href="#" id="about">About</a></li>

      </ul>
    </div>
  </div>
</nav>
 <img src="http://www.unixstickers.com/image/cache/data/stickers/meme/gentleman/Gentleman.sh-600x600.png" href="#" id="logo">

 <div id="searchbox">Search text</div>
    <form class="searchbox" action="">
        <input type="search" placeholder="Search"/>

    </form>

</body>
</html>

Collectives™ on Stack Overflow

jquery not working script

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related