Jquery切换菜单和带滚动的Jquery显示和隐藏

我正在进行导航,并且在Jquery方面遇到了一些问题。

1) 当悬停在菜单右侧的图像上时,只有当悬停在右侧图像上时才需要显示下拉菜单。

2) 当你让屏幕小于800px时,它会显示一个下拉菜单。我希望使用红色按钮平稳地上下切换菜单

有人能帮忙吗?

http://jsfiddle.net/558pA/1/

/*  MAIN MENU DROPDOWN
===================================*/
$(".toggle-nav").click(function () {
    $("#nav").slideToggle('slow');
});

/*  MAIN SETTINGS SHOW AND HIDE
===================================*/

('.user-profile').hover(

function () {
    $(this).show();
},

function () {
    $(this).hide();
});