Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 21.03.2020, 09:55
Интересующийся
Отправить личное сообщение для Владислав_Со Посмотреть профиль Найти все сообщения от Владислав_Со
 
Регистрация: 03.03.2020
Сообщений: 13

Как поправить z-index или сделать без него?
Можно ли сделать так (js), чтобы модальное окно было выше всех окон или уменьшало z-index всех блоков в секции на 1 при нажатии на вызов модального окна?? или как сделать по другому? (опыта мало)

Проблема в том, что для позиционирования было взято z-index, но с ним вышли проблемы. В каждом блоке свое мадальное окно.. и дпругие окна перекрывают его, т.к. в том блоке меньше z-index чем в окнах ниже.
P.S. Увеличение z-index в css модального окна.. ничего не даст, т.к. он будет только выше всех элементов именно в этом блоке, а не тех, что ниже.

var inp = document.getElementsByClassName("lightbox1");
for (var i = 0; i < inp.length; i++) {
  inp[i].onclick = function() {
    document.documentElement.style.overflow = this.checked ? "hidden" : "auto";
    document.documentElement.style.marginRight = this.checked ? "17px" : "";
    document.documentElement.style.zIndex = this.checked ? "999" : "auto";
  };
}




Ответить с цитированием
  #2 (permalink)  
Старый 21.03.2020, 11:31
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,053

Ну так добавляйте свои попапы перед </body> и не будет проблем.
Ответить с цитированием
  #3 (permalink)  
Старый 21.03.2020, 16:18
Интересующийся
Отправить личное сообщение для Владислав_Со Посмотреть профиль Найти все сообщения от Владислав_Со
 
Регистрация: 03.03.2020
Сообщений: 13

А как можно привязать этот кусок кода (если кинуть его сверху весь.. их там штук 12), чтобы открывалось при нажатии на кнопку/ссылку возле каждого блока? (не знаюю..)
<input type="checkbox" id="case-11" class="lightbox1"/>
<label for="case-11"> View case study</label>
    <div><div>
           <label for="case-11"></label>
               <div>
                       <div>ParkApp<label for="case-11">✖</label></div>
                       <div><img src="./images/case_study1.1.jpg" alt=""></div>
               </div>
      </div></div>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как сделать скролл без возврата? Александр141 Элементы интерфейса 3 24.08.2015 15:40
Сборка js-файла из кусков (Grunt или без него) vasa_c Общие вопросы Javascript 0 19.11.2013 14:30
как сделать tooltip без jQuery CrossFire Элементы интерфейса 2 18.11.2013 00:29
как сделать чтобы калькулятор считал автоматически без нажатия на кнопку станислав123 Общие вопросы Javascript 1 14.12.2012 15:54
Как сделать чтоб функция выволнялась по click один раз или просто выполнялась? TaH4uk.pro jQuery 1 06.12.2012 20:41