Remix not working


#1

I took the code from this exercise to create a disappearing menu on my own website, but I cannot get it to work, I'm assuming I have been doing something wrong but can't see it.

html:

<head>
<link href="styles/styles.css" rel="stylesheet" type="text/css">
<link href='http://fonts.googleapis.com/css?family=Oswald:700' rel='stylesheet' type='text/css'>
<title>Home</title>
</head>

<body>
<div class= "menu">
	<div class= "icon-close">
		<img id="x-icon" src= "images/x.png">
	</div>
	
	<a class="pagelink" href="index.html">Home</a>
	<a class="pagelink" href="games.html">Games</a>	
	<a class="pagelink" href="brad.html">Brad</a>
	<a class="pagelink" href="rapgenerator.html">Rap Generator</a>
	<a class="pagelink" href="videos.html">Videos</a>
	<a class="pagelink" href="about.html">About</a>
</div>

<img class="icon-menu" src= images/menu.jpg>

<h4>Home</h4>
<h5>Have Fun</h5>


<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="scripts/main.js"></script>
<script src="drop-down-menu.js"></script>
</body>
</html>

CSS:

body{
top: 0;
background-color: white;
margin: 0px;
position: relative;
}

.menu{
top: -185;
width: 100%;
position: fixed;
height: 185px;
 }

 .icon-menu{
display: block;
margin: auto;
width: 45px;
height: 45px;
}

JavaScript:

 var main = function() {
  /* Push the body and the nav down by 160px over */
   $(".icon-menu").click(function(){
     $('.menu').animate({
           top: "0px"
    }, 200);
    
    $('body').animate({
      top: "185px"
    }, 200);
  });

  /* Then push them back */
  $('.icon-close').click(function() {
    $('.menu').animate({
      top: "-185px"
    }, 200);

    $('body').animate({
      top: "0px"
    }, 200);
  });
};

$(document).ready(main);

#2

@cubeo,
You should change
-1

<img class="icon-menu" src= "images/menu.jpg">

-2

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

#3

Thank you for these fixes, but they did not get it working. Thank you anyway:)