zoOmer,
<html>
<head>
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<style>
#floatmenu {
width: 330px;
height: 40px;
padding: 0 5px 0 0px;
position: fixed;
bottom: 0px;
right: -177px;
z-index: 2;
}
#bottom2 {
background-color: #4679bd;
position: absolute;
height: 48px;
right: 0px;
bottom: -2px;
padding-bottom: 3px;
}
#bottom {
background-color: #4679bd;
position: absolute;
width: 95%;
height: 48px;
left: 0px;
bottom: -2px;
padding-left: 10px;
padding-bottom: 3px;
}
#cfgmenu img {margin:1px; padding:8px 5px 1px;}
</style>
</head>
<body>
<div id="bottom" >
<div id="floatmenu">
<div id="bottom2">
<span id="cfgmenu"><center>
<img src="http://png-2.findicons.com/files/icons/2584/freecns/16/arrow_left.png" onclick="" border="0">
<img src="http://png-5.findicons.com/files/icons/989/ivista_2/32/image.png" onclick="" border="0"><img src="http://png-5.findicons.com/files/icons/989/ivista_2/32/image.png" onclick="" border="0"> <img src="http://png-5.findicons.com/files/icons/989/ivista_2/32/image.png" onclick="" border="0"><img src="http://png-5.findicons.com/files/icons/989/ivista_2/32/image.png" onclick="" border="0"><img src="http://png-5.findicons.com/files/icons/989/ivista_2/32/image.png" onclick="" border="0"><img src="http://png-5.findicons.com/files/icons/989/ivista_2/32/image.png" onclick="" border="0"></center></span>
</div>
</div>
</div>
<script>
$(document).ready(function() {
var n = 1;
$("#floatmenu img:first").mouseenter(function() {
n ^= 1;
$("#floatmenu").stop().animate({
right: n ? "-177" : "0"
}, "medium")
})
});
</script>
</body>
</html>