想要做一个悬浮菜单，在电脑上用鼠标滑动到相应地方，显示菜单。
在移动版时候触摸相应地方，显示菜单。
实现方法我用了给一个标签绑定onclick onmouseenter onmouseleave事件。
在电脑版上测试成功。
但是如果在移动版上，点击相应位置，菜单滑下来，然后立即收回去
这样该怎么解决？？
html：

        <a id="header_site_button" href="javascript:;"><img src="favicon_white.png" alt="标志"> <span>网站</span></a>
        <ul id="header_site_menu">
            <li><a href="/">首页</a></li>
            <li><a href="/forum/">版区</a></li>
            <li><a href="/search/">搜索</a></li>
            <li><a href="/discover/">发现</a></li>
        </ul>

js：

$('a#header_user_button').click(function () {
    if ($("ul#header_user_menu").is(":visible")) {
        $("ul#header_user_menu").hide("fast");
        $("a#header_user_button").css("background-color", "#07F");
    } else {
        $("ul#header_user_menu").show("fast");
        $("a#header_user_button").css("background-color", "#09F");
        $("ul#header_site_menu").hide("fast");
        $("a#header_site_button").css("background-color", "#07F");
    }
});
$('p#header_user').mouseenter(function () {
    $("ul#header_user_menu").show("fast");
    $("a#header_user_button").css("background-color", "#09F");
});
$('p#header_user').mouseleave(function () {
    $("ul#header_user_menu").hide("fast");
    $("a#header_user_button").css("background-color", "#07F");
});

采用jquery技术开发。。
该如何解决呢？？