資料載入中

我是 chung

鎖住記憶

  • Chung
  • 0°C
  • 11 年又 204 天

判斷捲軸的位置

當捲軸往下移動時,判段目前移動到哪個位置...
Javascript部份

$(function(){
$(window).scroll(function () {
var scrollVal = $(this).scrollTop();
$("span.qScrollTop").text(scrollVal);
})
});

html部份

<span class="qScrollTop" style="position:fixed;"></span>

可以利用在哪裡?...那可多了...

例如:讓捲軸捲動到某個位置時,原本隱藏的物件讓他顯示出來、反之讓他隱藏起來。

台北市松山區八德路四段650號 Go

  • 捲軸移動位置的判斷
  • Javascript控制捲軸顯示物件
  • 隱藏物件的顯示與隱藏
  • HTML與Javascript的結合應用
  • 網頁捲軸效果的實現方法
https://innstory.com/story-判斷捲軸的位置-383

上一篇
 台北東區宇澤小舖

下一篇
想看玩命關頭7 

發表留言

  • 哲煜

    捲軸移動時顯示或隱藏物件的功能確實能提升使用者體驗。這樣的互動設計讓網頁看起來更有層次感,使用者能更清楚地找到想要的資訊。
    2026-08-06 下午 2 點回覆
  • 林蜜雪

    Chung 請問我照貼了 也有引入Jquery 怎麼還是不能跑
    9 年又 353 天回覆
    • Chung

      測試過沒問題哦~ 因為是為了監看捲軸的位置...所以記得把畫面的高設高一些。
      9 年又 352 天回覆

作者簡介

我是chung,網路工作者

主業是網站系統開發建置
副業是做夢、紀錄故事
作品請參考:teme.biz
做夢請參考:innstory.com
聯絡:chung.teme@gmail.com

有人用筆寫日記,有人用歲月寫日記,有人用照片寫日記,而我,用innstory寫日記。


推薦閱讀

作者其他相關類別故事

解決png圖檔GD合圖後背景色塊問題

解決png圖檔GD合圖後背景…

Chung 11 年又 62 天 2.2K

重點在於設定圖片走透明通道~

使用dp.SyntaxHighlighter 程式碼色彩顯示工具,讓紀錄程式心得更有可看性

使用dp.SyntaxHig…

Chung 11 年又 11 天 2.7K

說好了要在innstory裡寫下故事紀錄... 所以是不是有方便紀錄的工具或方式,就變成我在開發in...

我在開會

我在開會

Chung 2026-04-27 下午 9 點 610

我的2個小孩中,5G算是較為古靈精怪的那位。 原則上她的好多行為都讓我哭笑不得~ 這會她媽媽剛好有...


推薦閱讀

這個地址也發生了其他故事

Mandy說我想要募款去紐西蘭@@

Mandy說我想要募款去紐西…

Chung 11 年又 135 天 2.2K

(示意圖,不確定是不是南湖大山..是在寫太魯閣系統時使用的素材) 我對爬山沒什麼概念...對南湖...

圖型插件Elastislide

圖型插件Elastislid…

Chung 11 年又 148 天 2.4K

Elastislide是一款好用的圖形插件... 通常用來當圖像目錄時效果還不錯.... 今天在...

PHP數字轉國字...

PHP數字轉國字...

Chung 11 年又 265 天 3.1K

什麼鬼...客戶系統的需求竟然有一個數字要轉成國字.... 數字轉國字...數字轉國字...就是要把...


附近景點

這個地址-台北市松山區八德路四段650號-附近還有甚麼?

  • 原大阪商船株式會社臺北支店
  • 勸業銀行舊廈
  • 內湖郭氏古宅
  • 機器局第五號倉庫
  • 原臺北信用組合(今合作金庫城內支庫)
  • 中山基督長老教會