Javascript-форум - Исчезновение меню при клике на ссылку

Javascript-форум (https://javascript.ru/forum/)

- Элементы интерфейса (https://javascript.ru/forum/dom-window/)

- - Исчезновение меню при клике на ссылку (https://javascript.ru/forum/dom-window/58962-ischeznovenie-menyu-pri-klike-na-ssylku.html)

Исчезновение меню при клике на ссылку

Всем привет! Возник такой вопрос, в мобильной версии сайта есть меню, которой всплывает при клике на слово "меню", к ссылкам привязаны анкоры, так вот проблема в том, что при клике на ссылку, например "Факты", страница опускается, но меню само не исчезает.
Вот код скрипта:

Код:

    <script type="text/javascript">

        $(document).ready(function(){

            var touch = $('#touch-menu');

            var menu = $('.nav');

         

            $(touch).on('click', function(e) {

                e.preventDefault();

                menu.slideToggle();

            });

            $(window).resize(function(){

                var wid = $(window).width();

                if(wid > 760 && menu.is(':hidden')) {

                    menu.removeAttr('style');

                }

            });

            

        });

</script>

Так вот, как сделать так, чтобы меню скрывалось при клике на ссылку или на боди сайта?

Вот код, который плавного перехода по ссылкам, может в него что-то дописать, чтобы всплывающее меню исчезало?

// 
			$('a[href^="#"]').click(function () { 
			    elementClick = $(this).attr("href");
				destination = $(elementClick).offset().top;
				if($.browser.safari){
				$('body').animate( { scrollTop: destination }, 1000 );
				} else {
			    	$('html').animate( { scrollTop: destination }, 1000 );
				}
				return false;
		   });
		});

Цитата:

Сообщение от wiserfild (Сообщение 392687)

Вот код, который плавного перехода по ссылкам, может в него что-то дописать, чтобы всплывающее меню исчезало?

// 
			$('a[href^="#"]').click(function () { 
			    elementClick = $(this).attr("href");
				destination = $(elementClick).offset().top;
				if($.browser.safari){
				$('body').animate( { scrollTop: destination }, 1000 );
				} else {
			    	$('html').animate( { scrollTop: destination }, 1000 );
				}
				return false;
		   });
		});

Скинь html код

html

<header id="header">
        <div class="logo">
           <a href="#" class="font1"><span style="color: #ffffff">ДЕМО</span><span style="color: #cfc91d">САЙТ</span></a>
        </div>

<div id="message">

        <a href="#" id="touch-menu">МЕНЮ</a>
        <nav>
            <ul class="nav">
                <li><a href="#about">ОБО МНЕ</a></li>
                <li><a href="#service">УСЛУГИ</a></li>
                <li><a href="#facts">ФАКТЫ</a></li>
                <li><a href="#contacts">КОНТАКТЫ</a></li>               
            </ul>
        </nav>
</div>

    </header>

css

Код:

header {

        background: #02918c;

        width: 100%;

        z-index: 9999;

        position: fixed;

        height: 60px;



}

.logo {float: left;

        font-size: 26px;

        line-height: 60px;

        margin-left: 88px;

        font-family: "Open Sans";}

.nav {float: right;}

.nav {margin-right: 22px;}

.nav li {float: left;}

.nav li a,

#touch-menu {

        display: block;

        font-weight: bold;

        color: #fff;

        line-height: 60px;

        padding: 0 22px;



}

.nav li a:hover, #touch-menu:hover

 {

        background: #28a19d;

        }



#touch-menu {display: none;}



@media (max-width: 1000px) {

        body {padding-top: 60px}

        header {

                position: fixed;

                top: 0;

                left: 0;

                right: 0;

                height: 60px;

        }

        .logo {

                font-size: 18px;

                line-height: 60px;

                margin-left: 20px;

        }

        .nav {

                position: absolute;

                top: 100%;

                left: 50%;

                right: 0;

                display: none;

                width: 50%;



        }

        .nav li {float: none;}

        .nav li a {

                color: #ffffff;

                background: #02918c;

                text-align: center;

        }

        .nav li:first-child a {border-top: none;}

        .nav li a:hover {

                color: #ffffff;

                background: #28a19d;

        }

        #touch-menu {

                display: block;

                float: right;

                height: 60px;

                padding: 0 20px;

                line-height: 60px;

                /*margin-right: 20px;*/

        }