通过if判断进行收缩框

    xiaoxiao2022-07-03  125

    .if判断

    收缩展开菜单

    If判断:

           ·根据情况,做不同的事情

           ·判断是否相同 用 “==”

    更复杂的判断

     ·if ,else if , else

    <!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> <style type="text/css"> p, ul, li { padding: 0; margin: 0; list-style: none; } #box { font-size: 12px; color: #00c; width: 58px; margin: 0 auto; } p { width: 55px; height: 24px; line-height: 24px; padding-left: 3px; background: url(ico.gif) no-repeat right 4px; } ul { width: 56px; border: 1px solid #9a99ff; display: none-; } a { text-decoration: none; display: block; height: 24px; line-height: 24px; text-align: center; color: #00c; } a:hover { background: #d9e1f6; } </style> <script type="text/javascript"> window.onload=function () { var oP=document.getElementById('btn'); var oUl=document.getElementById('ul1'); oP.onclick=function () { if(oUl.style.display=='block') { oUl.style.display='none'; } else //none { oUl.style.display='block'; } }; }; </script> </head> <body> <div id="box"> <p id="btn">输入法</p> <ul id="ul1" style="display:block;"> <li><a href="#">手写</a></li> <li><a href="#">拼音</a></li> <li><a href="#">关闭</a></li> </ul> </div> </body> </html>

     

    最新回复(0)