Убирать скролл под открывающимся блоком?

Question

[Чёкатилло]

Имеется нужный скрипт:

var block = document.querySelector('#rcl-tabs');
var button= document.querySelector('#but');

block.hidden=1;
var closeButton= document.createElement('span');
closeButton.classList.add('close-button');
block.appendChild(closeButton);


closeButton.onclick= button.onclick = function() {
  if (!block) {
    return;
  }


  block.hidden= !block.hidden;
};

Но нет в нем этой функции..
Помогите плиз дописать, Господа ) Сжальтесь, будьте любезны )

Спасибо за внимание!

Comments

[Чёкатилло]

В css имеется скролл в нужном блоке #but, а убрать нужно, так понимаю, на body, при открывании #but

[Exploding]

Баба Яга: Обновил ответ

[Exploding]

Баба Яга: Обновил ответ еще раз

Answer 1

[Exploding]

Осенило! Автор хочет добиться эффекта: открыли модальное окно - body не скролится. Окно закрыли - body скролится как обычно.
Вариантов решения этой задачи столько - сколько людей ее решают:)

UPD. Вот тебе ... вариант. Все работает. Если что поправишь уже селекторы.
.btn - кнопка которая вкл/выкл блок #rcl-tabs

Написан кусок этот по спец.методике развивающей память. На крайний случай мышечную:)

Comments

[Чёкатилло]

Я поставил вопрос так, потому что мне нужно решение без коррекции верстки
Мне нужно только одно,- решить вопрос имея этот скрипт, только дописав его =)

[Exploding]

Баба Яга: Тогда так:

if($("#rcl-tabs:visible").length) $("body").css("overflow", "hidden"); else $("body").css("overflow", "auto");

[Чёкатилло]

Exploding: Я настолько бабка старая, что не шарю в скриптах )
Чет куда не тыкал вашу строку, у мня не получается Не могли бы ткнуть ее куда-то здесь:

var block = document.querySelector('#rcl-tabs');
var button= document.querySelector('#but');

block.hidden=1;
var closeButton= document.createElement('span');
closeButton.classList.add('close-button');
block.appendChild(closeButton);

closeButton.onclick= button.onclick = function() {
  if (!block) {
    return;
  }


  block.hidden= !block.hidden;
};

(=

[Exploding]

Баба Яга: в самом низу перед };
И jq чтоб был подключен проверьте

[Exploding]

Баба Яга: "старая" и "тыкал" кое на что намекает))

[Чёкатилло]

Exploding: тахто?

var block = document.querySelector('#rcl-tabs');
var button= document.querySelector('#but');

block.hidden=1;
var closeButton= document.createElement('span');
closeButton.classList.add('close-button');
block.appendChild(closeButton);

closeButton.onclick= button.onclick = function() {
  if (!block) {
    return;
  }
  
  block.hidden= !block.hidden;
if($("#rcl-tabs:visible").length) $("body").css("overflow", "hidden");
else $("body").css("overflow", "auto");
};

щё то не, щё то ни работая у мене ;(
Скролл осталси

[Exploding]

Баба Яга: обновил ответ

[Чёкатилло]

Exploding: усё работая Спасиб унучёк

Answer 2

[Даниил Боровков]

Горизонтальный скролл убирает свойство

element{
  overflow-x: hidden
}

Comments

[Чёкатилло]

не Мне вертикальный )

[Даниил Боровков]

Баба Яга:

element{
  overflow-y: hidden;
}

это если не нужно смотреть вылазиющий контент

[Чёкатилло]

Даниил Боровков: контент открываемого блока надо просматривать Он имеет скролл В css я знаю как сделать Скрипт не знаю )

[Павел Корнилов]

Баба Яга: так напиши в CSS что бы ты сделал?

[Чёкатилло]

KorniloFF: Дак, в css я укажу, допустим:

element{
  overflow: hidden;
}

но скрипт то, как я понимаю, без вмешательства не внесет поправки на body

[Чёкатилло]

KorniloFF: на вскидку, может в эти строки вносить css:

if (!block) {
    return;
  }

??? =)

[Павел Корнилов]

на вскидку, может в эти строки вносить css:

В смысле, в это условие? Я не знаю, поскольку пока не смог логику работы понять, но вот перевод с CSS на яваскрипт:
element.style.overflow= "hidden";

Answer 3

[Павел Корнилов]

на вскидку, может в эти строки вносить css:

В смысле, в это условие? Я не знаю, поскольку пока не смог логику работы понять, но вот перевод с CSS на яваскрипт:
element.style.overflow= "hidden";

Comments

[Чёкатилло]

Я могу лишь сказать в эти строки )) Спасиб