星期五, 3月 18, 2011

隱藏顯示語法分享(firefox也可用哦)




因為原來側欄就有放部落格寵物等小玩意,為了不佔太多版面,運用了隱藏語法,勾選後就會顯示,在IE使用下沒有問題;但xuite改版後,用IE6在編輯文章時xuite介面變得很慢,又不想更新到IE8,而開始改用火狐,不過原來的隱藏語法就失效了,最近偶然研究出火狐也可正常運作的隱藏顯示語法,也已在xuite自由欄位測試後使用愉快,想跟大家分享一下,有興趣的人也可以運用看看!

目前使用以方格勾選的樣式為主,也可依個人喜好自行變化為圓形或按鈕(type=radio或submit),語法如下:

<!--點擊式開關內容_開始-->
<input type="checkbox" onclick="document.getElementById('a1').style.display=(document.getElementById('a1').style.display=='none'?'':'none');"> 自定內容標題
</input>
<div id="a1" style="display:none">
你要隱藏的內容
</div>
<!--點擊式開關內容_結束-->


如果同時放一個以上隱藏顯示的語法,記得要將上面紅字部分自行編號,如a2、a3...以此類推,id可以改成任何你要的名稱,按順序排列就好,不要重覆;若想一開始就顯示,勾選後關閉,就將<div id="xxx" style="display:none">改為<div id="xxx" style="display:yes">。(更新)另外也可以用點擊文字的方式,語法就不是<input>而要改成<a href="javascript:;">囉!


範例效果如下:

捉迷藏



捉迷藏






捉迷藏





沒有留言: