本帖最后由 pyboy 于 2014-5-27 17:51 编辑
script中代码如下:- <script type="text/javascript">
- function divShow()
- {
- var thisNode = event.srcElement;
- var divNodes = document.getElementsByTagName("div");
- for(var x = 0; x < divNodes.length; x++)
- {
- if(thisNode == divNodes[x])
- {
- if(thisNode.className == "divOpen")
- {
- thisNode.className = "divClose";
- }
- else
- {
- thisNode.className = "divOpen";
- }
- }
- else
- {
- divNodes[x].className = "divClose";
- }
- }
- //alert(divNode.nodeName);
- }
- </script>
复制代码
css代码如下:
- <style type="text/css">
- .test_demo {overflow: hidden; height: 8px; width: 120px; background:#0FF;}
- .divOpen{
- overflow:visible;
- height:8px;
- background:#cccccc;
- width:120px;
- }
- .divClose{
- overflow:hidden;
- height:8px;
- background:#0FF;
- width:120px;
- }
- </style>
复制代码
body中代码
- <div class="test_demo" onclick="divShow()">
- 总是显示滚动条
- </div>
- <div class="test_demo" onclick="divShow()">
- 总是显示滚动条
- </div>
- <div class="test_demo" onclick="divShow()">
- 总是显示滚动条
- </div>
- <div class="test_demo" onclick="divShow()">
- 总是显示滚动条
- </div>
- <div class="test_demo" onclick="divShow()">
- 总是显示滚动条
- </div>
- <div class="test_demo" onclick="divShow()">
- 总是显示滚动条
- </div>
- <div class="test_demo" onclick="divShow()">
- 总是显示滚动条
- </div>
复制代码
显示结果:
C:\Users\Administrator\Desktop\1.jpg |
|