ArcadiA Club
ArcadiA Club


AAC FORUM     AAC News     AAC Box    



Home Page   Home Page
programmazione.htm   Programmazione - FORUM sezione  Vai al FORUM
 
Username:
Password:
Iscriviti!  |  Recupero password



Iscriviti GRATIS, potrai navigare senza questa
fascia e accedere a contenuti esclusivi:

    E-Mail:

Password:



 

 
- Modificare i CSS attraverso JavaScript -
 
COSA SERVE PER QUESTO TUTORIAL
Chiedi sul FORUM | Glossario Un browser web - conoscenze basiche riguardo ad Internet
Gli oggetti document, element, node e la proprietà innerHTML

PANORAMICA SU CSS
Cos'è e a cosa può servire

I fogli di stile CSS (Cascade Style Sheet) sono uno standard per specificare la presentazione visuale di documenti HTML. CSS è una tecnologia destinata all'uso da parte di chi è interessato alla visualizzazione precisa dei documenti HTML. Interessa i programmatori JavaScript lato client perché il DOM consente di utilizzare negli script gli stili applicati ai singoli elementi di un documento.
Utilizzati insieme, CSS e JavaScript permettono di generare svariati effetti visivi, impropriamente conosciuti come Dynamic HTML (DHTML). Questo consente di modificare dinamicamente colori e caratteri, di cambiare la posizione degli elementi e persino di nasconderli e mostrarli.

MODIFICARE DINAMICAMENTE GLI STILI DI UN ELEMENTO
La proprietà style

Ogni elemento rappresentato sulla pagina possiede una proprietà style. Questa proprietà fornisce l'accesso da parte dello script a tutte le proprietà CSS supportate per quell'elemento dal browser utilizzato. I valori delle proprietà sono gli stessi utilizzati per le specifiche di CSS, spesso con una sintassi diversa rispetto a simili impostazioni utilizzate dagli attributi dei tag HTML. Così, per impostare il colore del testo di un elemento il cui ID è "testo", la sintassi sarà la seguente:

document.getElementById("testo").style.color= "#ffff00 ";

Alcuni nomi di proprietà CSS non sono però conformi alle convenzioni di denominazione di JavaScript. Diverse proprietà CSS contengono trattini: in questi casi, l'equivalente di scripting della proprietà unisce le parole e applica la maiuscola all'inizio di ognuna. Per esempio, la proprietà di stile font-weight nello scripting viene impostata come di seguito:

document.getElementById("testo").style.fontWeight = "bold";

ANIMAZIONI DHTML
Come muovere dinamicamente oggetti della pagina

Tra le tecniche più potenti che si possono ottenere con JavaScript e CSS vi sono le animazioni. Non c'è nulla di particolare in riguardo alle animazioni DHTML: basta cambiare periodicamente una o più proprietà di stile di uno o più elementi. Così, per far scorrere un'immagine verso sinistra, s'incrementa la proprietà style.right dell'immagine ripetutamente, finché essa non raggiunge la posizione desiderata.


<< INDIETRO by Joker-81  


Video collegati Visualizza i video di questa pagina
Visualizza video sull'argomento "dhtml".
Visualizza video sull'argomento "style".
Visualizza video sull'argomento "animazioni".
Visualizza video sull'argomento "modifica".
Visualizza video sull'argomento "dinamica".
Visualizza video sull'argomento "css dhtml style animazioni modifica dinamica".


Dì la tua: cosa ne pensi?
Esponi il tuo punto di vista e condividilo con migliaia di persone

Oggetto nuova discussione:


Testo del messaggio:

E-Mail:

Quanto fa più dieci:




 





^ TOP  
Linkaci | Segnala errore | Invita | Stampa


pubblicità | privacy | visione | diritti | ufficio stampa | donazioni | scrivici
© 1999-2023 - P.IVA 02284690035 - Grafica, layout e contenuti sono di esclusiva proprietà di ArcadiA Club.

Powered by:
Spazi pubblicitari di alto livello
 

Compra in un click! | Cerca prodotti in offerta: