逝者如斯夫

          靜而思之
          數(shù)據(jù)加載中……

          DHTML的onScroll事件

          IE 瀏覽器提供了一個 onscroll 事件用于捕捉頁面垂直和水平的滾動,但在Netscape 卻沒有提供這樣的事件,它只有一個屬性指明了滾動條當(dāng)前的位置。寫上一點的代碼我們也一樣可以給Netscape 加上和IE 差不多的onscroll 事件和屬性。在IE 里,響應(yīng)onscroll 事件僅僅是在BODY 標(biāo)簽加上一個onscroll 事件屬性這樣簡單,當(dāng)然這個屬性值也可以是一個函數(shù)。


          可以用第二種方法實現(xiàn)和onscroll 事件類似的功能,用自己的函數(shù)賦值一個特定事件。方法的思路是建立一個時間器不斷的檢測用戶是否滾動了頁面,當(dāng)用戶滾動頁面則調(diào)用那個我們賦值給了onscroll 函數(shù)。



          ????
          function ?testScroll()?{

          ????
          // ?程序剛開始時初始化滾動條位置臨時變量
          ???? if ?(window._pageXOffset == null )?{
          ????window._pageXOffset?
          = ?window.pageXOffset
          ????window._pageYOffset?
          = ?window.pageYOffset
          ????}

          ????
          // ?實現(xiàn)和IE?類似的模塊
          ????document.body.scrollTop? = ?window.pageYOffset
          ????document.body.scrollLeft?
          = ?window.pageXOffset
          ????window.document.body.scrollHeight?
          = ?document.height
          ????window.document.body.scrollWidth?
          = ?document.width

          ????
          // ?如果臨時變量不等于當(dāng)前值則調(diào)用onscroll?事件
          ???? if ?(((window.pageXOffset != window._pageXOffset)? ||
          ????(window.pageYOffset
          != window._pageYOffset))? && ?(window.onscroll))
          ????window.onscroll()
          ????
          // ?設(shè)置臨時變量位置新值
          ????window._pageXOffset? = ?window.pageXOffset
          ????window._pageYOffset?
          = ?window.pageYOffset


          ????}

          ????
          // ?建立為Netscape?兼容的代碼
          ???? if ?(document.layers)?{
          ????document.body?
          = ? new ?Object
          ????setInterval(
          " testScroll() " , 50 )
          ????}

          ????
          // ?寫上自己onscroll?事件要做的事
          ???? function ?doScroll()?{
          ????
          // ?do?something
          ????}

          ????window.onscroll?
          = ?doScroll


          除了一個兼容的onscroll 事件以外,這個函數(shù)還建立一個跨瀏覽器的滾動屬性集框架。在IE ,滾動條當(dāng)前的位置屬性通過document.body 的一個屬性而被提供。我們一樣可以加入類似IE 提供的滾動條屬性集的功能給Netscape Navigator 。

          ????屬性?描述

          ????window.onscroll ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?? Sets?or?returns?the?
          function ?assigned?to?the?onscroll?event

          ????document.body.scrollTop

          ????document.body.scrollLeft???????????????? Returns?the?position?of?the?vertical?and?horizontal?scrollbars.

          ????document.body.scrollHeight

          ????document.body.scrollWidth ? ? ? ? ? ?? Returns?the?height?and?width?of?the?document

          ????document.body.clientHeight

          ????document.body.clientWidth ? ? ? ? ? ?? Returns?the?height?and?width?of?the?client?area?(the?currently?viewed?portion?of?the?document).

          如果使用用代碼實現(xiàn)滾動效果,則兩個瀏覽器都提供了一個互相兼容的方法:用window.scrollTo(x,y) 和 window.scrollBy(x,y) 滾動頁面。

          posted on 2007-03-25 02:32 ideame 閱讀(6046) 評論(0)  編輯  收藏 所屬分類: Script


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


          網(wǎng)站導(dǎo)航:
           
          主站蜘蛛池模板: 遵义县| 甘德县| 抚顺市| 神农架林区| 金塔县| 兰考县| 固原市| 沁阳市| 洪洞县| 安乡县| 浪卡子县| 阳原县| 石家庄市| 开化县| 如皋市| 汶上县| 监利县| 博爱县| 闵行区| 高平市| 昌图县| 舟曲县| 上林县| 南平市| 板桥市| 洪江市| 杭锦旗| 平安县| 蒙阴县| 澳门| 淮滨县| 资源县| 灵璧县| 河西区| 东明县| 永兴县| 建水县| 安国市| 海伦市| 锦州市| 江阴市|