Возник вопрос. Использую псевдокласс hover для того чтобы скрыть блок, но после того как я убираю курсор с блока он снова появляется. Каким образом можно сделать так, чтобы когда ты первый раз перемещаете курсор на объект он полностью исчезал и больше не появлялся пока пользователь не перезагрузит страницу?
2 ответа
let block = Array.prototype.slice.call(document.querySelectorAll('blockSelector'),0);
block.forEach(element => {
element.addEventListener('mouseover', ()=> {element.style.opacity = 0});
})
где фраза 'blockSelector', укажи CSS селектор ('.hiding_block' , например) в кавычках
-
через display элементы будут прыгать, т.к. они пропадают из dom 17 сен 2018 в 22:21
-
Можно так:
span {
background-color: blue;
margin: 10px;
width: 50px;
height: 50px;
float: left
}
<span onmouseover="this.style.opacity='0'"></span>
<span onmouseover="this.style.opacity='0'"></span>
<span onmouseover="this.style.opacity='0'"></span>
<span onmouseover="this.style.opacity='0'"></span>
<span onmouseover="this.style.opacity='0'"></span>
<span onmouseover="this.style.opacity='0'"></span>
<span onmouseover="this.style.opacity='0'"></span>
<span onmouseover="this.style.opacity='0'"></span>
<span onmouseover="this.style.opacity='0'"></span>
<span onmouseover="this.style.opacity='0'"></span>
<span onmouseover="this.style.opacity='0'"></span>
<span onmouseover="this.style.opacity='0'"></span>