javascript

37 risultati

GUIDA GRATUITA

Fase 1: creiamo l’HTML di base

Sei pronto a mettere le mani sul codice e creare qualcosa di davvero coinvolgente? In questo tutorial, realizzeremo insieme un quiz interattivo con il linguaggio JavaScript, perfetto per rendere il tuo sito web più stimolante e divertente. Quante volte ti sei fermato a rispondere a delle domande per capire se "sei un vero esperto di…

GUIDA GRATUITA

Fase 3: aggiungiamo interattività con JavaScript

Siamo giunti allo step finale: dobbiamo far muovere i nostri cursori e attivare l'effetto di click. Come? Semplicissimo, con il linguaggio Javascript! Creiamo il file script.js: const cursor = document.querySelector('.cursor'); const cursorDot = document.querySelector('.cursor-dot'); document.addEventListener('mousemove', e => { const mouseX = e.clientX; const mouseY = e.clientY; cursorDot.style.left = `${mouseX}px`; cursorDot.style.top = `${mouseY}px`; cursor.style.left =…

GUIDA GRATUITA

Fase 2: stilizziamo il cursore con il CSS.

Una volta settata la struttura grazie al linguaggio html, passiamo a dare un po’ di stile al nostro cursore avvalendoci del linguaggio CSS. Creiamo, quindi, il file style.css per stilizzare i nostri cursori: body { cursor: none; /* Nasconde il cursore predefinito */ background-color: #1D1E22; } h1 { color: #fff; text-align: center; margin-top: 50px;…

Vuoi avviare una nuova carriera o fare un upgrade?

Trova il corso Digital & Tech più adatto a te nel nostro catalogo!

Scopri i corsi 👨‍🏫

GUIDA GRATUITA

Fase 1: creiamo la struttura HTML di base

Quante volte, visitando un sito web, hai notato che il puntatore del mouse appariva diverso dal solito? Ti è mai capitato di vedere che il cursore, seguendo il movimento del mouse, cambiasse, per esempio, la sua forma o, addirittura, si animasse al click? Se ti è mai venuto in mente di provare a fare qualcosa…

GUIDA GRATUITA

Struttura della guida e come seguirla.

Questa guida è strutturata per accompagnarti in un viaggio nell’esplorazione della manipolazione del DOM da livello principiante fino a livello esperto. Si compone di tre sezioni principali, ciascuna focalizzata su un progetto pratico, che potrai replicare, con difficoltà crescente: Tutorial principiante - crea un cursorse personalizzato: inizieremo con la creazione di un cursore personalizzato.…

GUIDA GRATUITA

Requisiti e conoscenze preliminari.

Prima di addentrarci nella manipolazione del DOM, è importante avere una comprensione di base dei seguenti concetti: Linguaggio HTML: la struttura della pagina web, compresi i tag e gli attributi. Puoi rispolverare questi concetti consultando la nostra guida all’html in italiano! Linguaggio CSS: la stilizzazione e il layout degli elementi HTML. Puoi approfondire queste…

GUIDA GRATUITA

Perché manipolare il DOM con JavaScript?

Il DOM è fondamentale perché è ciò che permette di rendere le pagine web interattive e dinamiche. Con il linguaggio JavaScript, possiamo interagire con il DOM in modo fluido e immediato, offrendo agli utenti esperienze web coinvolgenti. JavaScript è il linguaggio di scripting nativo dei browser web, il che significa che può interagire con il…

GUIDA GRATUITA

Cos’è il DOM?

Il DOM (Document Object Model) è un concetto fondamentale nel web development che consente di creare pagine web interattive e dinamiche. Si tratta di una rappresentazione della struttura di un documento HTML o XML. Quando un browser carica una pagina web, esso crea automaticamente un modello del documento, noto come DOM, che rappresenta ogni parte…

GUIDA GRATUITA

Editor online Javascript

In questa breve guida vedremo come poter scrivere ed eseguire del codice javascript direttamente dal nostro browser su un editor online: non preoccuparti, è facilissimo! Ti basterà seguire questi steps. Pronto? Iniziamo! Creare un account su CodePen Apri il tuo browser e vai su codepen.io Clicca su "Sign Up" o "Registrati" per creare un account.…