如何在CSS中寫腳本實現交互效果?_Div+CSS教程

      編輯Tag賺U幣
      教程Tag:暫無Tag,歡迎添加,賺取U幣!
        
        我們瀏覽網頁的時候,經常會碰到一些交互的效果。例如容器在鼠標移上去的時候,會發生一些變化。這些效果,可以用多種方法來實現。現在我們要解決的是如何在CSS中寫腳本實現交互效果。

        CSS代碼如下:

      示例代碼 [www.wf0088.com]
      event:expression(
      onmouseover = function()
      {
      this.style.backgroundColor='#ccc'
      this.style.border='1px solid #000'
      },
      onmouseout = function()
      {
      this.style.backgroundColor='#f0f0f0'
      this.style.border='1px solid #c00'
      }
      )

        這段代碼的意思是定義了鼠標的兩種不同的狀態,onmouseover、onmouseout,在兩種不同的狀態下,對元素應用不同的樣式設置。這樣就達到了我們想要的交互效果。

        請看下面的實例:

      代碼調試框 [www.wf0088.com]

      [ 可先修改部分代碼 再運行查看效果 ]

        

      來源:無憂整理//所屬分類:Div+CSS教程/更新時間:2007-01-24
      相關Div+CSS教程