[CSS+JavaScript]Show/Hide Div按滑鼠顯示隱藏內容

[CSS+JavaScript]Show/Hide Div按滑鼠顯示隱藏內容

<script type=”text/javascript” language=”JavaScript”><!–
function HideContent(d) {
document.getElementById(d).style.display = “none”;
}
function ShowContent(d) {
document.getElementById(d).style.display = “block”;
}
function ReverseDisplay(d) {
if(document.getElementById(d).style.display == “none”) { document.getElementById(d).style.display = “block”; }
else { document.getElementById(d).style.display = “none”; }
}
//–></script>

◎加入CSS樣式

<div id=”uniquename” style=”display:none;”>
<p>要隱藏/顯示的內容放在這裡</p>
</div>

◎在Div中加入JavaScript,下列共有三種隱藏/顯示的方式,可依據需求選擇不同的顯示方式。

<a href=”javascript:ShowContent(‘uniquename’)“>
點擊此顯示內容
</a>

<a href=”javascript:HideContent(‘uniquename’)“>
點擊此隱藏內容
</a>

<a href=”javascript:ReverseDisplay(‘uniquename’)“>
點擊此顯示/隱藏內容
</a>

參考出處: http://blog.xuite.net/jon6773/blog/23662229

Share and Enjoy:
  • Print
  • Digg
  • StumbleUpon
  • del.icio.us
  • Facebook
  • Yahoo! Buzz
  • Twitter
  • Google Bookmarks
  • MySpace
  • Plurk
  • RSS
  • Google Buzz
  • Live
本篇發表於 JavaScrip。將永久鏈結加入書籤。

發表迴響

你的電子郵件位址並不會被公開。 必要欄位標記為 *