Javascript-форум - Закрытие блока по нажатию в любом месте

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

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

- - Закрытие блока по нажатию в любом месте (https://javascript.ru/forum/dom-window/57577-zakrytie-bloka-po-nazhatiyu-v-lyubom-meste.html)

в очередной раз спасибо огромное!

Цитата:

Сообщение от рони (Сообщение 385057)

maximamus,
Открывашка 204 + закрытие по клику вне блока или кнопок чем не оно

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .active-menu-item{background: #FFE4B5;}
    div.menu-mega{display:none; width:600px;height:200px;}
	div.menu-main-item{display:block; width:200px; height:100px;  border:1px solid #333;}
    #menu-restoran{background-color: green}
	#menu-trade{background-color: pink}
	#menu-equipment{background-color: blue}
 .closeButton{
 display:inline-block;
 float:right;
 margin-right:12px;
 margin-top:12px;
 cursor: pointer;
  background-color: #FFFF00;
}

  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
    $(function() {
    var $but = $(".menu-main-item"),
        $blocks = $(".menu-mega");
    $but.each(function(i, elem) {
        var $el = $(elem);
        $el.click(function() {
            $but.not($el).removeClass("active-menu-item");
            $el.toggleClass("active-menu-item");
            $blocks.filter(function(j, el) {
                i == j && $(el).slideToggle();
                return i != j
            }).slideUp();
        })
    });
    $('html').click(function (event) {
          if ($(event.target).closest('.menu-main-item, .menu-mega' ).size() && !$(event.target).is('.closeButton')) return;
          $but.filter('.active-menu-item').click()
      });
});
  </script>
</head>

<body>
    <!--использую navbar bootstrap -->
<ul class="menu-main-nav">
<li><a class="menu-main-item" href="#" data-item="menu-restoran">Для ресторанов<i class="main-choise"></i></a></li>
<li><a class="menu-main-item" href="#" data-item="menu-trade">Для торговли<i class="main-choise"></i></a></li>
<li><a class="menu-main-item" href="#" data-item="menu-equipment">Торговое оборудование<i class="main-choise"></i></a></li>
</ul>
<!--Блок выпадающего мегаменю</i> -->
<div class="menu-mega" id="menu-restoran"> <span class="closeButton" >Х</span>
	    test 1
</div>
<!-- тут дальше еще три блока  -->
<div class="menu-mega" id="menu-trade">  <span class="closeButton" >Х</span>
	    test 2
</div>
<div class="menu-mega" id="menu-equipment"> <span class="closeButton" >Х</span>
	    test 3
</div>
</body>

</html>

И есть еще один вопрос
У меня сделано так, что при нажатии в любом месте браузера открывающиеся блок был по центру, так вот, когда закрываешь блок и немного проскролил, оно опять центрирует. Как можно отменить цетровку при закрытии блока?

Цитата:

Сообщение от maximamus

У меня сделано так, что при нажатии в любом месте браузера открывающиеся блок был по центру, так вот, когда закрываешь блок и немного проскролил, оно опять центрирует. Как можно отменить цетровку при закрытии блока?

не осилил, попробуйте сделать макет.

<!--якорь, куда центрирует</i> -->
<a id="section50" class="in-page-link"></a>



<ul class="menu-main-nav">

<!--ссылка с переходом в якорь - #section50 </i> -->

    <li><a class="menu-main-item inner-link col-sm-4 text-center feature futr" href="#section50" data-item="object">
          <img src="/images/atrak.png">
          <h5 class="header-upper">Тематичні об’єкти</h5>            		
           <i class="main-choise"></i></a>
    </li>
</ul>

Цитата:

Сообщение от рони (Сообщение 385127)

не осилил, попробуйте сделать макет.

скинул код выше, помогите пожалуйста

maximamus,
всё одно не понимаю

Цитата:

Сообщение от рони (Сообщение 385932)

maximamus,
всё одно не понимаю

а что скинуть, что бы было более понятней?

maximamus,
http://plnkr.co/edit/?p=preview
макет живой нужен и/или картинка - без вашего html css js гадать только

Цитата:

Сообщение от рони (Сообщение 385941)

maximamus,
http://plnkr.co/edit/?p=preview
макет живой нужен и/или картинка - без вашего html css js гадать только

http://plnkr.co/edit/yUzuaIYcG4UhyGXJmQyZ?p=preview

попробовал сделать, вроде и все что нужно загрузил, пробовал уже загрузить все скрипты, что используются на сайте, но что то не скролит в нужное место и понять не могу в чем дело

test - вот выгрузил готовый тест, может тут будет понятней - раздел - Ми знаємо куди застосувати архітектурний бетон в:

maximamus,
открыл блок - произошло центрование - закрыл блок - немного проскролил - ничего ни куда не центрует.