acerbic coffee
          走自己的路,讓別人跑步
          posts - 26,comments - 14,trackbacks - 0

          ???? 唉!! 加班!!趁著這時間上網查點有用的東西,剛剛弄到一個過去不清楚的概念,現在發出來

          注:以下均為摘抄!~~~~
          大多數人很容易將CSS屬性display和visibility混淆,它們看似沒有什么不同,其實它們的差別卻是很大的。
          visibility屬性用來確定元素是顯示還是隱藏,這用visibility="visible|hidden"來表示,visible表示顯示,hidden表示隱藏。當visibility被設置為"hidden"的時候,元素雖然被隱藏了,但它仍然占據它原來所在的位置。例:

          < script?language = " JavaScript " > ?
          function ?toggleVisibility(me) {?
          if ?(me.style.visibility == " hidden " ) {?
          me.style.visibility
          = " visible " ;?
          }
          ?
          else ? {?
          me.style.visibility
          = " hidden " ;?
          }
          ?
          }
          ?
          </ script > ?
          < div?onclick = " toggleVisibility(this) " ?style = " position:relative " >
          第一行文本將會觸發"hidden"和"visible"屬性,注意第二行的變化。
          因為visibility會保留元素的位置,所以第二行不會移動. 注意到,當元素被隱藏之后,就不能再接收到其它事件了,所以在第一段代碼中,當其被設為"hidden"的時候,就不能再接收響應到事件了,因此也就無法通過鼠標點擊第一段文本令其顯示出來。另一方面,display屬性就有一點不同了。visibility屬性是隱藏元素但保持元素的浮動位置,而display實際上是設置元素的浮動特征。當display被設置為block(塊)時,容器中所有的元素將會被當作一個單獨的塊,就像<div>元素一樣,它會在那個點被放入到頁面中。(實際上你可以設置<span>的display:block,使其可以像<div>一樣工作。將display設置為inline,將使其行為和元素inline一樣---即使它是普通的塊元素如<div>,它也將會被組合成像<span>那樣的輸出流。最后是display被設置:none,這時元素實際上就從頁面中被移走,它下面所在的元素就會被自動跟上填充。下面看我實例的代碼和效果:
          <script?language="JavaScript">?
          function?toggleDisplay(me){?
          if?(me.style.display=="block"){?
          me.style.display
          ="inline";?
          alert(
          "文本現在是:'inline'.");?
          }
          ?
          else?{?
          if?(me.style.display=="inline"){?
          me.style.display
          ="none";?
          alert(
          "文本現在是:'none'.?3秒鐘后自動重新顯示。");?
          window.setTimeout(
          "blueText.style.display='block';",3000,"JavaScript");?
          }
          ?
          else?{?
          me.style.display
          ="block";?
          alert(
          "文本現在是:'block'.");?
          }
          ?
          }
          ?
          }
          ?
          </script>?
          <div><span?id="blueText"?onclick="toggleDisplay(this)"?
          style
          ="color:blue;position:relative;cursor:hand;">藍色</span>文字上點擊來查看效果.</div>
          posted on 2006-11-08 18:59 acerbic coffee 閱讀(124) 評論(0)  編輯  收藏

          只有注冊用戶登錄后才能發表評論。


          網站導航:
           
          主站蜘蛛池模板: 墨竹工卡县| 池州市| 惠水县| 博乐市| 深圳市| 青龙| 梁山县| 龙川县| 八宿县| 乌苏市| 环江| 泾川县| 建水县| 祥云县| 江川县| 内江市| 华容县| 穆棱市| 顺平县| 兴海县| 凌云县| 金乡县| 突泉县| 沐川县| 龙泉市| 崇礼县| 双流县| 静海县| 都匀市| 邯郸市| 澄迈县| 朝阳区| 衡南县| 巧家县| 彩票| 徐水县| 准格尔旗| 许昌市| 日照市| 微山县| 盘山县|