ui.widget.ScrollTo
Het grootste probleem met het gebruik van de ScrollTo-widget is dat het moeilijk kan zijn om te bepalen waar de cursor van de gebruiker naartoe gaat wanneer deze op de widget klikt. Dit kan het moeilijk maken om een gebruiksvriendelijke gebruikersinterface te maken.
$(window).scroll(function() {
var scroll = $(window).scrollTop();
//>=, not <=
if (scroll >= 100) {
//clearHeader, not clearheader - caps H
$("#header").addClass("scrolled");
} else {
$("#header").removeClass("scrolled");
} }); //missing );
Deze code is geschreven in jQuery en wordt gebruikt om de CSS-klasse van een element te wijzigen wanneer de gebruiker naar beneden scrolt op de pagina.
De eerste regel creëert een functie die wordt uitgevoerd wanneer de gebruiker scrolt. De tweede regel slaat de waarde op van hoe ver de gebruiker naar beneden op de pagina is gescrold in een variabele genaamd 'scroll'. De derde regel zegt dat als de waarde van 'scroll' groter is dan of gelijk is aan 100, de CSS-klasse van het element met id 'header' moet worden gewijzigd in 'scrolled'. Als dit niet het geval is, moet het worden teruggezet naar de oorspronkelijke klasse.
import
jQuery biedt een handige manier om andere JavaScript-bestanden in uw project te importeren. Gebruik hiervoor de jQuery import() functie. Om bijvoorbeeld het bestand myfile.js in uw project te importeren, gebruikt u de volgende code:
importeer { mijnBestand } uit './mijnbestand.js';
Hierdoor wordt myfile.js automatisch opgenomen in uw huidige projectomvang en wordt het beschikbaar gemaakt voor gebruik in uw code.
Developer tools
Er zijn een aantal ontwikkelaarstools beschikbaar in jQuery. Deze tools kunnen worden gebruikt om code te debuggen, DOM-elementen te inspecteren en aan te passen, en meer.
