zoukankan      html  css  js  c++  java
  • 给网友写的控制页面元素高度的代码(js)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        
    <title>无标题页</title>
        
    <script type="text/javascript">
                            
    function $(id)
                        
    {
                         
    return document.getElementById(id);
                        }

    function ss()
    {
            
    var wd=$("aa");
            
    //wd= wd.toString().substr(0,3);
            for (var i=1;i<wd.childNodes.length;i++)
            
    {
                
    var wdH=wd.childNodes[i].clientHeight;
    //            alert(wdH);
                if(wdH>200)
                
    {
                     wd.childNodes[i].style.overflow
    ="hidden";
                    wd.childNodes[i].style.height
    ="200px";
                    
    //alert(document.getElementById('aa').style.width);
                }

            }


    }


        
    </script>
        
    <style>
        #aa 
    { clear:both}
        #aa div 
    { float:left; display:inline; margin-left:15px; }
        .bor 
    { border:1px solid #DDDDDD;}
        
    </style>
    </head>
    <body onload="ss">

    <div id="aa">
       
    <div style="height:10px;" class="bor">dsas</div>
       
    <div style="height:400px; background:blue" class="bor">雕刻家司克拉</div>
       
    <div style="height:200px; background:#CCCCCC;" class="bor">dsafdsaf</div>
       
    <div class="bor">地方啊</div>
       
    <div>单位俄</div>
       
    <div class="bor">的fe</div>
       
    <div class="bor">wewrew </div>
       
    </div>
    <br />
    <div onclick="ss()" style="clear:both; border:1px solid #DDDDDD; background:#D5D5D5; 100px;">点击自适应</div>
    </body> 
    </html>
  • 相关阅读:
    【linux 高级网络应用】1,2-企业IP规划部署实战,ip地址和子网划分
    【linux CCNP】4,5-linux网络及OIS-TCP/IP
    【linux CCNP】3-linux网络抓包和TCP三次握手
    【linux CCNA】1和2-linux网络基础知识入门 与 tcp协议
    CephFS文件储存
    OSD纵向扩容
    CEPH之对象存储
    CEPH之块存储
    ceph_dashboard
    ceph 创建和删除osd
  • 原文地址:https://www.cnblogs.com/Longkin/p/1203809.html
Copyright © 2011-2022 走看看