Đã giải quyết: onscroll add class jquery

ui.widget.ScrollTo

Vấn đề chính khi sử dụng tiện ích ScrollTo là có thể khó kiểm soát vị trí con trỏ của người dùng sẽ di chuyển khi họ nhấp vào tiện ích. Điều này có thể gây khó khăn cho việc tạo giao diện người dùng dễ sử dụng.

$(window).scroll(function() {    
    var scroll = $(window).scrollTop();

    //>=, not <=
    if (scroll >= 100) {
        //clearHeader, not clearheader - caps H
        $("#header").addClass("scrolled");
    } else {
        $("#header").removeClass("scrolled");  
    }  }); //missing );

Mã này được viết bằng jQuery và được sử dụng để thay đổi lớp CSS của một phần tử khi người dùng cuộn trang xuống.

Dòng đầu tiên tạo một hàm sẽ được thực thi khi người dùng cuộn. Dòng thứ hai lưu trữ giá trị khoảng cách mà người dùng đã cuộn xuống trang trong một biến có tên là 'scroll'. Dòng thứ ba nói rằng nếu giá trị của 'cuộn' lớn hơn hoặc bằng 100, thì lớp CSS của phần tử có id là 'tiêu đề' sẽ được thay đổi thành 'cuộn'. Nếu không, thì nó nên được thay đổi trở lại lớp ban đầu.

Nhập khẩu

jQuery cung cấp một cách thuận tiện để nhập các tệp JavaScript khác vào dự án của bạn. Để thực hiện việc này, hãy sử dụng hàm nhập () của jQuery. Ví dụ: để nhập tệp myfile.js vào dự án của bạn, bạn sẽ sử dụng đoạn mã sau:

nhập {myFile} từ './myfile.js';

Điều này sẽ tự động bao gồm myfile.js trong phạm vi dự án hiện tại của bạn và cung cấp nó để sử dụng trong mã của bạn.

Những công cụ phát triển

Có một số công cụ dành cho nhà phát triển có sẵn trong jQuery. Những công cụ này có thể được sử dụng để gỡ lỗi mã, kiểm tra và sửa đổi các phần tử DOM, v.v.

bài viết liên quan:

Để lại một bình luận