在三个元素上都绑定
click
点击事件时,只有opacity:0触发了
let box1 = document.querySelector(".box1");
box1.addEventListener("click", function () {
console.log("box1被点击了");
let box2 = document.querySelector(".box2");
box2.addEventListener("click", function () {
console.log("box2被点击了");
let box3 = document.querySelector(".box3");
box3.addEventListener("click", function () {
console.log("box3被点击了");
无过渡
无过渡
opacity:0 过渡
子元素设置可见是否生效
不生效
生效
opacity:0 不生效
为三个元素的子元素设置相应的可见时,在页面中只有visibility设置显示了内容。
.box1 .child {
display: block;
.box2 .child {
visibility: visible;
.box3 .child {
opacity: 1;
粉丝