Jolly,
может как-то так ...
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
/* Body */
body {
position: relative;
}
.block {
margin: 0 auto;
overflow: hidden;
position: absolute;
width: 285px;
left: -300px;
transition: left .8s ease-in-out;
}
/* Menu */
.menu {
background: #555 url('images/menu-bg.jpg') repeat left top;
height: 100%;
width: 100%;
}
/* Basic CSS */
.background {
background-image: url('images/chicago-night.jpg');
height: 100%;
width: 100%;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
.menu ul {
border-top: 1px solid #555;
list-style: none;
margin: 0;
padding: 0;
}
.menu li {
border-bottom: 1px solid #555;
font-family: 'Open Sans', sans-serif;
line-height: 45px;
padding-bottom: 3px;
padding-left: 20px;
padding-top: 3px;
}
.menu li:hover {
cursor: pointer;
background-color: #555;
}
.menu a {
color: #fff;
font-size: 15px;
text-decoration: none;
text-transform: uppercase;
}
.icon-close {
cursor: pointer;
padding-left: 10px;
padding-top: 10px;
padding-bottom: 6px;
}
.icon-menu {
cursor: pointer;
font-family: 'Open Sans', sans-serif;
font-size: 20px;
padding-bottom: 25px;
padding-left: 25px;
padding-top: 25px;
text-decoration: none;
text-transform: uppercase;
}
.icon-menu img {
margin-right: 5px;
}
.block.open {
left: 0px
}
</style>
</head>
<body>
<div class="icon-menu">
Menu
</div>
<div class="block">
<div class="background">
<div class="menu">
<!-- Иконка меню -->
<div class="icon-close">
<img src="images/close-btn.png">
</div>
<!-- Меню -->
<ul>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Help</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(function() {
/* Открытие меню */
//главная функция
$('.icon-menu').click(function() {
$('.block').toggleClass('open')
});
/* Закрытие меню */
$('.icon-close').click(function() {
$('.block').removeClass('open')
});
});
</script>
</body>
</html>