javascript实现点击收缩的效果

发布时间:2020-04-29编辑:脚本学堂
一个很简单的点击收缩的效果,javascript代码实现,有需要的朋友,可以参考下。

1、html内容

<div onclick="showmenu(1)" style="cursor:hand;">点击收缩</div>
<div id="subitem1">脚本学堂_www.jb200.com,欢迎大家的光临。<br />脚本学堂_www.jb200.com,欢迎大家的光临。</div>
  
 <div onclick="showmenu(2)" style="cursor:hand;">点击收缩</div>
 <div id="subitem2">脚本学堂_www.jb200.com!<br />脚本学堂_www.jb200.com!</div>

2、Js代码

<script language="javascript">
/**
 * desc: 点击收缩
 * site: www.jb200.com
*/
   function showmenu(sid)
     {
      var subitem=document.getElementById("subitem"+sid);
     //subitem.style.display=subitem.style.display=='none'?'':'none';
     if(subitem.style.display=='none'){
       subitem.style.display='';
      }
      else{
      subitem.style.display='none';
     }
}
</script>