Блог

У меня есть несколько HTML-меню, которые я показываю полностью, когда пользователь нажимает на заголовок этих меню. Я хотел бы скрыть эти элементы, когда пользователь нажимает за пределами области меню, а также при повторном нажатии на раздел myaccount.

Вот код,

 <li onclick="san()">
<div id="topnav"><a id="displayText" href="#" class="signin">My Acount</a></div>
<div id="topnav1" style="display:none;"><a id="displayText1" href="#">My Acount</a></div>
</li>

    <div id="signin_menu" style="display:none;">
            <div class="droptop"></div>
            <div class="maindropsign">
                        <div class="header_box">My Acount</div>
                        <div class="txt_drop"><a href="#">My Profile</a></div>
                        <div class="txt_drop"><a href="#">My Backer History</a></div>
                        <div class="txt_drop"><a href="#">Edit Settings</a></div>
                        <div class="txt_drop_log"><a href="#">Log Out</a></div>
            </div>
            <div class="dropbut"></div>
  </div>

<script language="javascript"> 
function san() 
{
    if(document.getElementById('signin_menu').style.display=='')
    {
    document.getElementById('signin_menu').style.display='none';
    document.getElementById('topnav1').style.display='none';
    document.getElementById('topnav').style.display='';
    }
    else
    {
    document.getElementById('signin_menu').style.display='';
    document.getElementById('topnav1').style.display='';
    document.getElementById('topnav').style.display='none';
    }

} 
</script>
  

Пожалуйста, помогите мне это сделать.

Сначала вы должны запомнить состояние меню, например, установить var open = true при его открытии. Затем создайте функцию, которая «переключает», и привяжите ее к событию onClick вашего заголовка меню. Затем либо привяжите функцию closeMenu к событию onClick непосредственно ко всему вашему документу, либо к onMouseOut из вашего меню (вы даже можете создать задержку здесь).