Показать сообщение отдельно
  #1 (permalink)  
Старый 23.07.2021, 15:11
Интересующийся
Отправить личное сообщение для Андрей812 Посмотреть профиль Найти все сообщения от Андрей812
 
Регистрация: 10.09.2018
Сообщений: 27

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


<!DOCTYPE html>
<html lang="ru">

<head>
    <meta charset="UTF-8">
    <style>
    .help_content {
    background: green;
    color: #fff;
    }   
    .close {
    position: absolute;
    right: 32px;
    top: 32px;
    width: 32px;
    height: 32px;
    opacity: 0.3;
    }
    .close:hover {
    opacity: 1;
    }
    .close:before, .close:after {
    position: absolute;
    left: 15px;
    content: ' ';
    height: 33px;
    width: 2px;
    background-color: #333;
    }
    .close:before {
    transform: rotate(45deg);
    }
    .close:after {
    transform: rotate(-45deg);
    }
    </style>
</head>

<body>

    <div class="helptip-mod">БЛОК</div>
    <br/>
    <div class="helptip-mod">БЛОК2</div>
    <br/>
    <div class="helptip-mod">БЛОК3</div>
    <br/>

    <script>
    document.addEventListener("click",({target})=>{var resp='',rrp='';

    if(target.closest(".helptip-mod")){
        content=target.querySelector(".help_content"),
        otherСontent=document.querySelector(".helptip-mod .help_content");

        if(otherСontent&&otherСontent!=content)otherСontent.remove();

        if(content){
            content.remove();
            }else{
            var tt ='<ul><li>номер 1</li><li>номер 2</li><li>номер 3</li><li>номер 4</li></ul>';
            target.insertAdjacentHTML("beforeEnd",'<div class="help_content">'+tt+'<div class="close"></div></div>');
        }
    }

    });
    </script>
</body>
</html>
Ответить с цитированием