zoukankan      html  css  js  c++  java
  • 查看更多 详细介绍+点击收起 效果

    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    </head>
    
    <body>
    
    
    
    <DIV id=soft_instr name="soft_instr">
    1<br />
    2<br />
    3<br />
    4<br />
    5<br />
    6<br />
    1111111111<br />
    22222222222<br />
    3333333333<br />
    444444444444<br />
    5555555555555<br />
    666666666666666666<br />
    
    
    </DIV>
    
    
    <DIV id=comm_1 name="comm_1"></DIV>
    <DIV id=comm_2 style="DISPLAY: none" name="comm_2"></DIV>    
    <DIV id=comm_3 style="DISPLAY: none;" name="comm_3">
        <SPAN>
            <INPUT onclick="this.value==='详细介绍'?this.value='点击收起':this.value='详细介绍';show_brief();" type=button value="详细介绍" name=botton>
        </SPAN>
    </DIV>
    
    
    <SCRIPT type=text/javascript> 
            document.getElementById('comm_1').innerHTML=document.getElementById('soft_instr').innerHTML; 
            document.getElementById('comm_2').innerHTML=document.getElementById('soft_instr').innerHTML; 
           
           function show_brief(){
                var obj1=document.getElementById('comm_1');
                var obj2=document.getElementById('comm_2');
                if(obj1.style.display==""){
                    obj1.style.display="none";       
                    obj2.style.display="";   
                     obj2.innerHTML=document.getElementById('soft_instr').innerHTML;
                }else{
                    obj2.style.display="none";
                    obj1.style.display="";
                     obj1.innerHTML=document.getElementById('soft_instr').innerHTML; 
                }
                
           }
                
                 var _h=document.getElementById('comm_1').offsetHeight;
                  document.getElementById('soft_instr').style.display="none";
     
                if(_h > 200){
                    document.getElementById('comm_1').style.height="107px";
                    document.getElementById('comm_1').style.overflow="hidden";
                    document.getElementById('comm_3').style.display="block";
                }
               
        </SCRIPT>
    
    
    </body>
    </html>
  • 相关阅读:
    【软件测试部署基础】maven的认识
    测试管理那些事[组建测试团队的思考]
    Django 框架基本操作(二)
    测试人员的工作开展方式
    产品管理基础知识
    项目经理与职能经理的区别
    python 面向对象(二)
    Python 常用方法和模块的使用(time & datetime & os &random &sys &shutil)-(六)
    python基本案例实现
    JAVA基础——集合浅析
  • 原文地址:https://www.cnblogs.com/visi_zhangyang/p/2549708.html
Copyright © 2011-2022 走看看