Question

我的错误在哪里？鼠标上没有任何反应：

HTML

    <div id="spettacoli_div">
      <img class="spettacoli" src="grafica/spettacoli_di_sala.png" alt="spettacoli di sala" onmouseover="document.getElementById('spettacoli_di_sala_on').style.display = 'block';" onmouseout="document.getElementById('spettacoli_di_sala_on').style.display = 'hidden';"> 
     <div>
    <div id="spettacoli_on_div"> 
     <img class="spettacoli_on" id="spettacoli_di_sala_on" src="grafica/spettacoli_di_sala_on.png" alt="spettacoli di sala"> 
    </div>

CSS

.spettacoli_on {
    float: left;
    position:relative;
    padding-left: 4.4%;
    width:19.4%;
    height:auto;
    visibility: hidden;
}

非常感谢。

Answer 1

您正在使用CSS visibility隐藏元素，但您的JavaScript正在切换其display属性。

Answer 2

hidden不是display - 属性的有效值。设置display:none或使用visibility。

Answer 3

使用此代码

.spettacoli_on {
             float: left;
             position: relative;
             padding-left: 4.4%;
             width: 19.4%;
             height: auto;
             display: none;
         }


<div id="spettacoli_div">
      <img class="spettacoli" src="grafica/spettacoli_di_sala.png" alt="spettacoli di sala" onmouseover="document.getElementById('spettacoli_di_sala_on').style.display = 'block';" onmouseout="document.getElementById('spettacoli_di_sala_on').style.display = 'none';"> 
     <div>
    <div id="spettacoli_on_div"> 
     <img class="spettacoli_on" id="spettacoli_di_sala_on" src="grafica/spettacoli_di_sala_on.png" alt="spettacoli di sala"> 
    </div>

简单的javascript属性更改有些错误

3 个答案: