1

我希望图像充当切换开关，因此当单击它时，它将显示带有文本的 div。

这是我正在使用的 CSS 类：

.hidden { display: none; }
.unhidden { display: block; }

和JS：

 function unhide(divID) {
var item = document.getElementById(divID);
if (item) {
item.className=(item.className=='hidden')?'unhidden':'hidden';
  }
}//

这是HTML：

<div class="4u">                    
   <!-- Box -->
   <section class="box box-feature">
      <a href="javascript:unhide('test');" class="image image-full" 
      <img src="images/pic01.jpg" alt="" /></a>
   <div id="test" class="hidden">
       <header>
       <h2>Put something here</h2>
       <span class="byline">Maybe here as well I think</span>
       </header>
<p>Test and more text and more text and more text.</p>
    </div>                          
   </section>
  </div>
4

1 回答 1

1

您有语法错误。将第 4 行更改为：

  <a href="javascript:unhide('test');" class="image image-full">

注意>行尾的 。

除非您决定使用原生 JavaScript，否则更简单的方法是使用 jQuery。将此添加到您的<head>：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

然后你a href可以是公正的javascript:$('#test').toggle()，你不需要定义任何函数或 CSS 类。

于 2013-07-16T01:19:30.533 回答