|
jQuery: interazioni, creazione di elementi via codice e dissolvenze! |
|
Scritto da Luca Bonacorsi
|
|
11 Gennaio 2012 |
|
CLICCA QUI PER VEDERE L'ESEMPIO FUNZIONANTE. Se l'obiettivo è quello di creare elementi HTML in 'run-time' in corrispondenza del puntatore del 'mouse' in jQuery, questo è l'esempio che fa per voi! Testato sulle ultime versioni dei principali 'browser' (alcune proprietà di stile non sono supportate da alcuni 'browser' e, se notate malfunzionamenti, siete più che benvenuti a notificarmeli :)), l'esempio propone un elemento '<DIV>' sul quale potete fare liberamente tutti i 'click' che volete. Ad ogni 'click' vengono recuperate le coordinate del 'mouse' relative al documento e 'tradotte' in relazione all'elemento '<DIV'>.

Ad ogni rilascio del 'mouse' viene generato dinamicamente un elemento '<p>' del quale si variano in maniera opportuna le proprietà di posizionamento e al quale si applicano in 'run-time' stili CSS per la ridefinizione del suo 'box' e per la formattazione testuale. Inoltre, una volta generati, gli elementi '<P>' si dissolvono tramite un'animazione che, nell'esempio proposto, dura circa due secondi. Esempio importante che dimostra la potenza dell'associazione HTML/HTML 5, CSSC/SS3 e jQuery. Buon divertimento! :)
|