Selesai: onscroll add class jquery

ui.widget.ScrollTo

Masalah utama dengan menggunakan widget ScrollTo ialah sukar untuk mengawal di mana kursor pengguna akan bergerak apabila mereka mengklik pada widget. Ini boleh menyukarkan untuk mencipta antara muka pengguna yang mudah digunakan.

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

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

Kod ini ditulis dalam jQuery dan digunakan untuk menukar kelas CSS elemen apabila pengguna menatal ke bawah halaman.

Baris pertama mencipta fungsi yang akan dilaksanakan apabila pengguna menatal. Baris kedua menyimpan nilai sejauh mana ke bawah halaman yang pengguna telah menatal dalam pembolehubah yang dipanggil 'tatal'. Baris ketiga mengatakan bahawa jika nilai 'scroll' lebih besar daripada atau sama dengan 100, maka kelas CSS elemen dengan id 'header' harus ditukar kepada 'scrolled'. Jika tidak, maka ia harus ditukar kembali ke kelas asalnya.

Mengimport

jQuery menyediakan cara mudah untuk mengimport fail JavaScript lain ke dalam projek anda. Untuk melakukan ini, gunakan fungsi import() jQuery. Sebagai contoh, untuk mengimport fail myfile.js ke dalam projek anda, anda akan menggunakan kod berikut:

import { myFile } daripada './myfile.js';

Ini secara automatik akan memasukkan myfile.js dalam skop projek semasa anda dan menjadikannya tersedia untuk digunakan dalam kod anda.

Alat Pembangun

Terdapat beberapa alat pembangun yang tersedia dalam jQuery. Alat ini boleh digunakan untuk menyahpepijat kod, memeriksa dan mengubah suai elemen DOM dan banyak lagi.

Related posts:

Tinggalkan komen