黑马程序员技术交流社区

标题: 求助:关于overflow div重叠问题 [打印本页]

作者: pyboy    时间: 2014-5-25 09:09
标题: 求助:关于overflow div重叠问题
本帖最后由 pyboy 于 2014-5-27 17:51 编辑

script中代码如下:
  1. <script type="text/javascript">
  2.         function divShow()
  3.         {
  4.                 var thisNode = event.srcElement;
  5.                 var divNodes = document.getElementsByTagName("div");
  6.                 for(var x = 0; x < divNodes.length; x++)
  7.                 {
  8.                         if(thisNode == divNodes[x])
  9.                         {
  10.                                 if(thisNode.className == "divOpen")
  11.                                 {
  12.                                         thisNode.className = "divClose";
  13.                                 }
  14.                                 else
  15.                                 {
  16.                                         thisNode.className = "divOpen";
  17.                                 }
  18.                         }
  19.                         else
  20.                         {
  21.                                 divNodes[x].className = "divClose";
  22.                         }
  23.                 }
  24.                 //alert(divNode.nodeName);
  25.         }
  26. </script>
复制代码

css代码如下:
  1. <style type="text/css">
  2.   .test_demo {overflow: hidden; height: 8px; width: 120px; background:#0FF;}
  3.   .divOpen{
  4.           overflow:visible;
  5.           height:8px;
  6.           background:#cccccc;
  7.           width:120px;
  8.   }
  9.   .divClose{
  10.           overflow:hidden;
  11.           height:8px;
  12.           background:#0FF;
  13.           width:120px;
  14.   }
  15. </style>
复制代码

body中代码
  1. <div class="test_demo" onclick="divShow()">
  2.   总是显示滚动条
  3. </div>
  4. <div class="test_demo" onclick="divShow()">
  5.   总是显示滚动条
  6. </div>
  7. <div class="test_demo" onclick="divShow()">
  8.   总是显示滚动条
  9. </div>
  10. <div class="test_demo" onclick="divShow()">
  11.   总是显示滚动条
  12. </div>
  13. <div class="test_demo" onclick="divShow()">
  14.   总是显示滚动条
  15. </div>
  16. <div class="test_demo" onclick="divShow()">
  17.   总是显示滚动条
  18. </div>
  19. <div class="test_demo" onclick="divShow()">
  20.   总是显示滚动条
  21. </div>
复制代码


显示结果:
C:\Users\Administrator\Desktop\1.jpg
作者: pyboy    时间: 2014-5-27 08:01
额,没有人回答吗?
作者: pyboy    时间: 2014-5-27 17:51
没有人回答么,错误还没找到,看来只有进了黑马问老师了




欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2