Ratkaistu: rullaa lisää luokka jquery

ui.widget.ScrollTo

Suurin ongelma ScrollTo-widgetin käytössä on, että voi olla vaikea hallita, mihin käyttäjän kohdistin liikkuu, kun hän napsauttaa widgetiä. Tämä voi vaikeuttaa helppokäyttöisen käyttöliittymän luomista.

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

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

Tämä koodi on kirjoitettu jQueryssä, ja sitä käytetään elementin CSS-luokan vaihtamiseen, kun käyttäjä vierittää sivua alaspäin.

Ensimmäinen rivi luo toiminnon, joka suoritetaan, kun käyttäjä vierittää. Toinen rivi tallentaa arvon siitä, kuinka pitkälle sivua alaspäin käyttäjä on vierittänyt muuttujaan nimeltä "scroll". Kolmannella rivillä sanotaan, että jos 'scroll':n arvo on suurempi tai yhtä suuri kuin 100, elementin CSS-luokka, jonka tunnus on 'header', tulee vaihtaa arvoon 'scrolled'. Jos ei, se tulee vaihtaa takaisin alkuperäiseen luokkaansa.

Tuo

jQuery tarjoaa kätevän tavan tuoda muita JavaScript-tiedostoja projektiisi. Käytä tätä varten jQuery import() -funktiota. Jos esimerkiksi haluat tuoda tiedoston myfile.js projektiisi, käytä seuraavaa koodia:

tuo { myFile } tiedostosta './myfile.js';

Tämä sisällyttää automaattisesti myfile.js:n nykyiseen projektiisi ja asettaa sen käytettäväksi koodissasi.

Kehittäjän työkalut

JQueryssä on useita kehittäjätyökaluja. Näitä työkaluja voidaan käyttää koodin virheenkorjaukseen, DOM-elementtien tarkastamiseen ja muokkaamiseen ja paljon muuta.