jquery - jqueryドロップダウンliが消えない

Question

水平ドロップダウン メニューには 2 つの問題があります。アクティブな Web ページのドロップダウン領域を表示したい。さらに、メニューが消えないように、ユーザーが誤ってメニューを離れたときにメニューを非表示にするための時間遅延を追加したいと考えています。

私のHTML：

<ul id="mainnnav">
<li id='home'>
    Home
</li>
<li>
    Contact
    <ul class="subnav">
        <li id = 'Adress'>Adress</li>
        <li id = 'Telephone'>Telephone</li>
        <li id = 'Email'>E-mail</li>
    </ul>
</li>
<li>
    Services
    <ul class="subnav">
        <li id = 'Land'>Land</li>
        <li id = 'Infrastructure'>Infrastructure</li>
        <li id = 'Construction'>Construction</li>
    </ul>
</li>
<li>
    The company
    <ul class="subnav">
        <li id = 'About'>About</li>
        <li id = 'History'>History</li>
        <li id = 'Media'>Media</li>
    </ul>
</li>
</ul>    

私のjQuery：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script type='text/javascript'>
$(document).ready(function () {
var activepage = 'infrastructure'
var activesubli = $('li#'+ activepage);
var activemainli = activesubli.parents('li');
var pagesub = activesubli.parent('.subnav');
var timer;
var latest;

$('#mainnav li').hover(function () {
    $('ul:first',this).show();
    clearTimeout(timer);
}, function () {
    latest = $('ul:first', this);
    timer = setTimeout(function () {
        latest.hide();
                    pagesub.show();
    }, 1000);
});
});
</script>

問題 1: 私が達成したいのは、顧客が「インフラストラクチャ」ページにいるときに、サービスの前に UL が表示され、メニューをスクロールすると、アクティブなドロップダウン メニューが消えますが、顧客がメニューを離れると再び表示されることです。 （メニュー項目をクリックせずに）。問題は、アクティブなドロップダウン メニューが消えず、顧客が他のメニュー項目にカーソルを合わせている間、バックグラウンドにとどまることです。

問題 2: 私が直面しているもう 1 つの問題は、タイマーの問題です。ユーザーがメニューを離れると、メニューに最後にホバーされたドロップダウン セグメントを 1 秒間表示した後、アクティブなページのドロップダウン メニューに戻ります。ただし、ドロップダウン メニューを 1 秒以内に再度入力すると、まだ消えます。

誰かが私がここで見逃していることを指摘できますか?