我试图从W3C复制手风琴。我的项目分布在4个文件夹中:CSS,FONTS,IMAGES和SCRIPT。问题是JS不想切换背景图像。这是我的代码。无法更改手风琴上的箭头
CSS
.accordion {
width: 100%;
height: 34px;
border-style: none;
border-bottom: 1px solid #515151;
background-color: #000;
color: #fff;
text-align: left;
padding: 10px;
font-family: Tahoma;
font-size: 12px;
background-image: url(../IMAGES/arrow-right.png);
background-repeat: no-repeat;
background-position: 330px 15px;
transition: 0.4s;
cursor: pointer;
}
JS
for (i = 0; i < accordion.length; i++) {
accordion[i].onclick = function() {
this.nextElementSibling.classList.toggle('show');
if (this.textContent === 'Click to open') {
this.textContent = 'Click to close';
} else {
this.textContent = 'Click to open';
}
if (this.style.backgroundImage === 'url(../IMAGES/arrow-right.png)') {
this.style.backgroundImage = 'url(../IMAGES/arrow-down.png)';
} else {
this.style.backgroundImage = 'url(../IMAGES/arrow-right.png)';
}
}
}
什么是手风琴定义为?关联的HTML在哪里? – plumwd
手风琴是由打开div的按钮组成的。该HTML位于包含我上面提到的4个文件夹的主文件夹中。 –
向我们展示手风琴宣言和HTML。 – plumwd