DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> 如何控制框架頁的滾動
如何控制框架頁的滾動
編輯:關於JavaScript     

 解決思路

    利用框架文檔中window對象的scrollBy方法來滾動。

 具體步驟

 1. 包含框架頁的代碼。








  2.demo.htm頁代碼。這裡僅僅是為了測試效果,可以替換為你自己的頁面。



  注意:如果iframe所加載的頁為站外URL,將導致跨域問題,拒絕訪問。凡是涉及到對框架頁的訪問及控制,都會有跨域問題。

  特別提示

  代碼運行後的效果如圖1.6.8所示。鼠標移上四上按鈕上後,iframe內所加載的頁面將分別向上、下、左和右四個方面滾動,在按下鼠標時滾動速度加快,松開鼠標(仍然在按鈕上)時恢復速度,鼠標移開後滾動停止。

1.6.8 控制iframe的滾動

特別說明

  本例主要是window對象的scrollBy方法的應用。通過設置橫向滾動速度stepX和縱向滾動速度stepY為全局變量,在鼠標移上時在函數中用setInterval不斷調用scrollBy方法滾動頁面,通過參數控制滾動方向,在鼠標按下時放大全局變量stepX或stepY的值,人而達到加快滾動速度的效果,而鼠標移開後再用clearInterval方法清除之前的setInterval事件以停止滾動。

  scrollBy 將窗口滾動 x 和 y 偏移量。

  setInterval 每經過指定毫秒值後計算一個表達式。

  clearInterval 使用 setInterval 方法取消先前開始的間隔事件。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved