Javascript.RU

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

Чтобы функция делала z-index:1 для блоков
Добрый вечер! Можно ли написать такую функцию, чтобы при срабатывании другой функции, все блоки div в секии присваивали себе z-index:1 ?? (так как каждый блок имеет свой z-index) /

При использовании этого
<div class="lightbox">
    <input type="checkbox" id="case-1" class="lightbox1"/>
    <label for="case-1"> View case study</label>
    <div><div>
        <label for="case-1"></label>
        <div>
            <div>ParkApp<label for="case-1">✖</label></div>
            <div><img src="./images/case_study1.1.jpg" alt=""></div>
        </div>
    </div></div>
</div>


а вот его js
var inp = document.getElementsByClassName("lightbox_view");
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";
  };
}


Чтобы избежать вот этого безобразия
*** Огромная картинка ***

Последний раз редактировалось ksa, 24.03.2020 в 10:39. Причина: большая картинка
Ответить с цитированием
  #2 (permalink)  
Старый 24.03.2020, 10:04
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 2,692

document.documentElement.style.overflow = this.checked ? "hidden" : "auto";

Это как то странно.
documentElement - это весь документ. Вернее элемент <html>. В нем содержится все остальное.

Но не понятно, каким именно блокам и в какой секции нужно присвоить z-index

Последний раз редактировалось voraa, 24.03.2020 в 10:08.
Ответить с цитированием
  #3 (permalink)  
Старый 24.03.2020, 10:35
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 2,692

Не знаю, правильно ли я понимаю вашу задачу.
Но мне она представляется так
Есть некий контейнер , в котором содержатся блоки (12 шт), которые на экране перекрываются. И при клике на блок (или любой любой элемент внутри этого блока) этот блок должен оказаться в самом верху так, что бы его ничего не перекрывало.
<div id='cont'>
   <div class="lightbox">
      ......
   </div>

   <div class="lightbox">
      ......
   </div>
   ......
   <div class="lightbox">
      ......
   </div>
</div>

Правильно?

Если так, то не нужны никакие z-index.
Просто переставляем вверх блок, на который кликнули

const cont = document.getElementById('cont')
cont.querySelectorAll('.lightbox').forEach (dlb => dlb.addEventListener('click', () => cont.appendChild(dlb) ))


Можно и немного по-другому

const cont = document.getElementById('cont')
cont.addEventListener('click', (ev) => {
   const dbl = ev.target.closest('.lightbox')
   if (dbl) cont.appendChild(dlb)
})

Последний раз редактировалось voraa, 24.03.2020 в 10:53.
Ответить с цитированием
Ответ


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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Функция для нужного блока floody jQuery 8 16.02.2018 15:49
Как сделать так чтобы по нажатию на кнопку выполнялась функция? Zombie_Killer Общие вопросы Javascript 11 06.07.2017 21:34
Модуль для работы с модулями JSprog Ваши сайты и скрипты 29 02.09.2009 13:31
Переодическое обновление значений для графика, функция для обновления значений yupa87 Общие вопросы Javascript 0 09.07.2009 14:48
Функция onclick для созданных потомков Groonel Общие вопросы Javascript 6 24.04.2009 18:35