歡迎使用CSDN-markdown編輯器

寫東西晚啦,上次寫博客應該是倆月前了。工作快一個月了,一直在學習H5、div+css。工作需要,慢慢來。

用css實現一個下拉列表,借用網友的代碼:

box,#box2,#box3,#box4{padding:10px;border:1px solid green;}


js+css展開層

function openShutManager(oSourceObj,oTargetObj,shutAble,oOpenTip,oShutTip){ var sourceObj = typeof oSourceObj == "string" ? document.getElementById(oSourceObj) : oSourceObj; var targetObj = typeof oTargetObj == "string" ? document.getElementById(oTargetObj) : oTargetObj; var openTip = oOpenTip || ""; var shutTip = oShutTip || ""; if(targetObj.style.display!="none"){ if(shutAble) return; targetObj.style.display="none"; if(openTip && shutTip){ sourceObj.innerHTML = shutTip; } } else { targetObj.style.display="block"; if(openTip && shutTip){ sourceObj.innerHTML = openTip; } } }


展開

源碼愛好者(codefans.net)

展開

CodeFans.net 多少

展開

CodeFans.net是一個學習型源碼站,提供各類編程源代碼下載。

展開

謝謝您瀏覽本特效!



設置display爲none,用js函數來實現顯示。

下面是我自己所做項目的代碼:

+按關鍵詞篩選
  • 非法佔有
  • 自首
  • 罰金
  • 共同犯罪
  • 從犯
  • 故意犯
  • 非法佔有
  • 自首
  • 罰金
  • 共同犯罪
  • 從犯
  • 故意犯
  • 非法佔有
  • 自首
  • 罰金
  • 共同犯罪
  • 從犯
  • 故意犯
  • 非法佔有
  • 自首
  • 罰金
  • 共同犯罪
  • 從犯
  • 故意犯
                </div>
+按案由篩選
+ 刑事案由
  • + 危害國家安全
    • 分裂國家
    • 煽動分裂國家
    • 顛覆國家政權
    • 煽動顛覆國家政權
    • 間諜
                                            </li>
                                            <li>
                                                <font size="+1">
                                                    <button onclick="openShutManager(this,'box2_1_2',false,'-','+')">+</button>
                                                    <button style="width:auto;height:20px">危害公共安全
                                                    </button>
                                                </font>
                                                <div id="box2_1_2" style="display:none">
                                                    <ul>
                                                        <li>你厲害</li>
                                                        <li>苗真厲害</li>
                                                        <li>我厲害</li>
                                                    </ul>
                                                </div>
                                            </li>
                                            <li>
                                                <font size="+1">
                                                    <button onclick="openShutManager(this,'box2_1_3',false,'-','+')">+</button>
                                                    <button style="width:auto;height:20px;">破壞社會主義市場經濟秩序
                                                    </button>
                                                </font>
                                                <div id="box2_1_3" style="display:none">
                                                    <ul>
                                                        <li>你厲害</li>
                                                        <li>苗真厲害</li>
                                                        <li>我厲害</li>
                                                    </ul>
                                                </div>
                                            </li>
                                            <li>
                                                <font size="+1">
                                                    <button onclick="openShutManager(this,'box2_1_4',false,'-','+')">+</button>
                                                    <button style="width:auto;height:auto">侵犯公民人身權利、民主權利
                                                    </button>
                                                </font>
                                                <div id="box2_1_4" style="display:none">
                                                    <ul>
                                                        <li>你厲害</li>
                                                        <li>苗真厲害</li>
                                                        <li>我厲害</li>
                                                    </ul>
                                                </div>
                                            </li>
                                        </ul>
    
                                    </div>
    
                            </div>
                    </div>
    
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章