」工欲善其事,必先利其器。「—孔子《論語.錄靈公》
首頁 > 程式設計 > 如何使用jQuery根據垂直滾動位置添加和刪除CSS類?

如何使用jQuery根據垂直滾動位置添加和刪除CSS類?

發佈於2025-03-23
瀏覽:691

How Can I Use jQuery to Add and Remove CSS Classes Based on Vertical Scroll Position?

Add/Remove Class with jQuery Based on Vertical Scroll

In this instance, the goal is to remove the class from the "header" element once the user scrolls down a certain distance, and then apply a different class to alter its appearance.但是,提供的代碼因某些小錯誤而無法按預期運行。

有三個主要問題:

比較操作員不正確;應該> =檢查滾動位置是否大於或等於500。

刪除的類名稱被拼寫為Clearheader而不是Clearheader。在函數聲明的末尾缺少。
$(window).scroll(function() {
    var scroll = $(window).scrollTop();

    // >=, not = 500) {
        // clearHeader, not clearheader - caps H
        $(".clearHeader").addClass("darkHeader");
    }
});
在滾動滾動時重置類,使用第二個條件,如下所示:

通過解決這些問題,您現在可以根據用戶的垂直滾動位置有效地從標題中添加和刪除類。

最新教學 更多>

免責聲明: 提供的所有資源部分來自互聯網,如果有侵犯您的版權或其他權益,請說明詳細緣由並提供版權或權益證明然後發到郵箱:[email protected] 我們會在第一時間內為您處理。

Copyright© 2022 湘ICP备2022001581号-3