我尝试将带有 Eventlistener 的函数添加到带有 for 循环的一行 div 中。但是这些功能不起作用。div 中没有发生任何事情。所有 div 都在 PHP 文件中定义。
记者：
function chartouterdivscalemax(i) {
var a = document.getElementsByClassName('chartouterdiv');
a[i].style.transform = "scale(1.25)";
var b = document.getElementsByClassName('logocontainer');
b[i].style.transform = "scale(1.25)";
b[i].style.transform = "translate(0px, 10px)";
var c = document.getElementsByClassName('highdiv');
c[i].style.height = "70px";
var d = document.getElementsByClassName('lowdiv');
d[i].style.height = "35px";
}
function chartouterdivscalemin(i) {
var a = document.getElementsByClassName('chartouterdiv');
a[i].style.transform = "scale(1)";
var b = document.getElementsByClassName('logocontainer');
b[i].style.transform = "scale(1)";
var c = document.getElementsByClassName('highdiv');
c[i].style.height = "55px";
var d = document.getElementsByClassName('lowdiv');
d[i].style.height = "50px";
}
function iteratescalefunction() {
var elements = document.getElementsByClassName('chartouterdiv');
for (var i = 0; i <= elements.length; i++ ){
elements[i].addEventListener("mouseover", function(i){chartouterdivscalemax(i)}, false);
elements[i].addEventListener("mouseout", function(i){chartouterdivscalemin(i)}, false);
console.log(i);
}
}
CSS：
.chartouterdiv{
height:115px;
width:215px;
background-color: black;
display: flex;
align-items: center;
justify-content: center;
transition: 0.5s;
transform: scale(1);
}
.chartinnerdiv{
height: 105px;
width: 205px;
background-color: white;
}
.highdiv{
height: 55px;
width: 205px;
background-color: antiquewhite;
transition: 0.5s;
}
.lowdiv{
height: 50px;
width: 205p;
background-color: aqua;
display: flex;
align-items:center;
justify-content: center;
transition: 0.5s;
}
}
RISEBY
相关分类