Su questa pagina
- Utilizzare i comportamenti incorporati
- Applicare il comportamento Chiama JavaScript
- Applicare il comportamento Cambia proprietà
- Applicare il comportamento Controlla plugin
- Applicare il comportamento Trascina elemento PA
- Raccogliere informazioni sugli elementi PA trascinabili
- Applicare il comportamento Vai a URL
- Applicare il comportamento Menu di collegamento
- Applicare il comportamento Vai a menu di collegamento
- Applicare il comportamento Apri finestra browser
- Applicare il comportamento Messaggio popup
- Applicare il comportamento Precarica immagini
- Applicare il comportamento Imposta testo del frame
- Applicare il comportamento Imposta testo del contenitore
- Applicare il comportamento Imposta testo barra di stato
- Applicare il comportamento Imposta testo del campo di testo
- Applicare il comportamento Mostra-nascondi elementi
- Applicare il comportamento Scambia immagine
- Applicare il comportamento Convalida modulo
I comportamenti inclusi in Dreamweaver sono stati scritti per funzionare nei browser più moderni. In quelli più vecchi, potrebbero non funzionare (senza conseguenze).
Nota:
le azioni di Dreamweaver sono state scritte in modo da garantire la compatibilità con il maggior numero possibile di browser. Se rimuovete o sostituite manualmente del codice in un'azione di Dreamweaver, la compatibilità potrebbe essere pregiudicata.
Benché le azioni di Dreamweaver siano state scritte per ottimizzare la compatibilità tra i browser, alcuni browser non supportano JavaScript e molti utenti che navigano sul Web disattivano il supporto per JavaScript nei loro browser. Per ottenere i migliori risultati su tutte le piattaforme, fornite interfacce alternative racchiuse tra tag <noscript>, in modo da consentire ai visitatori sprovvisti del supporto per JavaScript di utilizzare comunque il sito.
Il comportamento Chiama JavaScript attiva una funzione personalizzata o una riga di codice JavaScript quando si verifica un evento. (Potete scrivere direttamente lo script oppure utilizzare codice distribuito gratuitamente mediante librerie JavaScript sul Web).
Il comportamento Cambia proprietà consente di modificare il valore di una delle proprietà di un oggetto, come il colore di sfondo di un div o l'azione associata a un modulo.
Nota:
questo comportamento può essere utilizzato solo se si conoscono approfonditamente i linguaggi HTML e JavaScript.
Il comportamento Controlla plugin consente di rimandare i visitatori a pagine differenti a seconda che abbiano installato o meno il plugin specificato. Ad esempio, potete rimandare i visitatori a una pagina se hanno Shockwave e a un'altra pagina se non dispongono di questo plugin.
Nota:
non è possibile rilevare plugin specifici in Internet Explorer con JavaScript. Tuttavia, se selezionate Flash o Director, alla pagina verrà aggiunto il codice VBScript appropriato per rilevare i plugin di Internet Explorer su Windows. Il controllo dei plugin non è possibile in Internet Explorer su Mac OS.
-
Specificate l'azione da eseguire se non è possibile rilevare il plugin. Per impostazione predefinita, quando il rilevamento non è possibile, il visitatore viene rimandato all'URL indicato nella casella Altrimenti. Per rimandare invece il visitatore al primo URL (Se individuato), selezionate l'opzione Vai sempre al primo URL se il rilevamento non è possibile. Se questa opzione è selezionata, si ipotizza che il visitatore sia dotato del plugin a meno che il browser non indichi esplicitamente che esso non sia presente. In generale, selezionate questa opzione se il contenuto del plugin è integrato nella pagina; altrimenti lasciate l'opzione deselezionata.
Nota:
questa opzione è valida solo per Internet Explorer, poiché Netscape Navigator è sempre in grado di rilevare i plugin.
Il comportamento Trascina elemento PA consente al visitatore di trascinare un elemento con posizione assoluta (PA). e può essere quindi utilizzato per creare puzzle, dispositivi di scorrimento e altri elementi mobili nell'interfaccia.
Potete specificare la direzione in cui il visitatore può trascinare l'elemento PA (in orizzontale, in verticale o in qualunque direzione), la destinazione di rilascio, se l'elemento PA deve essere agganciato alla destinazione quando si trova entro una distanza minima in pixel da essa, l'azione che deve essere eseguita quando l'elemento PA raggiunge la destinazione e altre opzioni ancora.
Poiché il comportamento Trascina elemento PA deve essere chiamato per consentire al visitatore di trascinare l'elemento PA, è necessario associare il comportamento Trascina elemento PA all'oggetto body (con l'evento onLoad).
-
-
Se selezionate l'opzione Con limitazioni, inserite un valore in pixel nelle caselle Su, Sotto, Sinistra e Destra.
Questi valori si riferiscono alla posizione iniziale dell'elemento PA. Per limitare lo spostamento a un'area rettangolare, inserite un valore positivo in tutte le caselle. Per consentire solo uno spostamento verticale, inserite un valore positivo nei campi Su e Sotto e il valore 0 nei campi Sinistra e Destra. Per consentire solo uno spostamento orizzontale, inserite un valore positivo nei campi Sinistra e Destra e il valore 0 nei campi Su e Sotto.
-
La destinazione di rilascio è il punto in cui desiderate che il visitatore trascini l'elemento PA. Un elemento PA raggiunge la destinazione di rilascio quando le sue coordinate sinistra e superiore corrispondono ai valori inseriti nelle caselle Sinistra e Sopra. Questi valori si riferiscono all'angolo superiore sinistro della finestra del browser. Per impostare automaticamente queste caselle di testo sulla posizione corrente dell'elemento PA, fate clic su Ottieni posizione corrente.
-
Selezionate Porta elemento in primo piano se desiderate visualizzare l'elemento PA sopra tutti gli altri oggetti durante il trascinamento. Se selezionate questa opzione, utilizzate il menu a comparsa per specificare se l'elemento PA deve rimanere in primo piano o tornare alla posizione originale dopo il trascinamento.
Inserite un codice JavaScript o il nome di una funzione (ad esempio, monitorAPelement()) nella casella di testo Chiama JavaScript per eseguire ripetutamente il codice o la funzione durante il trascinamento dell'elemento PA. Ad esempio, potete creare una funzione che controlli le coordinate dell'elemento PA e visualizzi suggerimenti come “ci sei quasi” o “sei ancora lontano dalla destinazione di rilascio” in una casella di testo.
-
Inserite un codice JavaScript o il nome di una funzione (ad esempio evaluateAPelementPos()) nella seconda casella Chiama JavaScript per eseguire tale codice o funzione quando l'elemento PA viene rilasciato. Per fare in modo che l'esecuzione venga avviata solo se l'elemento PA ha raggiunto la destinazione di rilascio, selezionate l'opzione Solo se calamitato.
Quando applicate l'azione Trascina elemento PA a un oggetto, Dreamweaver inserisce la funzione MM_dragLayer() nella sezione head del documento. (Il nome della funzione riflette il vecchio nome degli elementi PA [“Layer”, cioè livello] per far sì che i livelli creati nelle versioni precedenti di Dreamweaver risultino ancora modificabili.) Oltre a contrassegnare l'elemento PA come trascinabile, questa funzione definisce tre proprietà per ciascun elemento PA (MM_LEFTRIGHT, MM_UPDOWN e MM_SNAPPED) che possono essere utilizzate nelle funzioni JavaScript personalizzate per determinare la posizione relativa orizzontale e verticale dell'elemento PA e per stabilire se esso ha raggiunto la destinazione di rilascio.
Nota:
le informazioni fornite di seguito sono indirizzate esclusivamente ai programmatori JavaScript esperti.
Ad esempio, la funzione riportata di seguito visualizza il valore della proprietà MM_UPDOWN (la posizione verticale corrente dell'elemento PA) in un campo di modulo chiamato curPosField. I campi di modulo sono utili per visualizzare informazioni aggiornate di continuo perché sono dinamici, ovvero potete modificarne il contenuto al termine del caricamento della pagina.
function getPos(layerId){
var layerRef = document.getElementById(layerId);
var curVertPos = layerRef.MM_UPDOWN;
document.tracking.curPosField.value = curVertPos;
}
Invece di visualizzare il valore di MM_UPDOWN o MM_LEFTRIGHT in un campo di modulo, potete utilizzare questi valori in diversi altri modi. Ad esempio, potete creare una funzione che visualizzi un messaggio variabile a seconda della distanza dall'area di rilascio o richiamare un'altra funzione che visualizzi o nasconda un determinato elemento PA a seconda del valore.
La lettura della proprietà MM_SNAPPED è utile soprattutto quando sulla pagina sono presenti più elementi PA e il visitatore può passare alla pagina o all'attività successiva solo quando tutti gli elementi hanno raggiunto la propria destinazione. Ad esempio, potete creare una funzione che conti il numero di elementi PA in cui la proprietà MM_SNAPPED è associata al valore true e richiamare questa funzione ogni volta che viene rilasciato un elemento PA. Quando il conteggio raggiunge il numero desiderato, potete inviare il visitatore alla pagina successiva o visualizzare un messaggio di congratulazioni.
Il comportamento Vai a URL consente di aprire una nuova pagina nella finestra corrente o nel frame specificato. Utilizzando questo comportamento potete modificare il contenuto di due o più frame con un semplice clic.
-
In questo elenco vengono automaticamente inseriti i nomi di tutti i frame del set di frame corrente e della finestra principale. Se non è disponibile alcun frame, potete scegliere solo la finestra principale.
Nota:
se uno dei frame è associato al nome top, blank, self o parent, questo comportamento può produrre risultati imprevisti poiché il browser può confondere questi nomi con le destinazioni riservate.
Quando create un menu di collegamento selezionando Inserisci > Modulo > Menu di collegamento, Dreamweaver crea un oggetto di menu e gli applica il comportamento Menu di collegamento o Vai a menu di collegamento. Pertanto, di solito non è necessario collegare manualmente un oggetto al comportamento Menu di collegamento.
Un menu di collegamento esistente può essere modificato in due modi:
Potete modificare e riposizionare le voci del menu, cambiare i file di destinazione e cambiare la finestra in cui devono essere aperti facendo doppio clic su un comportamento Menu di collegamento esistente nel pannello Comportamenti.
Oppure, potete modificare le voci del menu con la stessa procedura utilizzata per qualunque altro menu, selezionando il menu e utilizzando il pulsante Elenco valori nella finestra di ispezione Proprietà.
Il comportamento Vai a menu di collegamento (strettamente collegato al comportamento Menu di collegamento) consente di associare un pulsante Vai a un menu di collegamento. Per poter utilizzare questo comportamento, all'interno del documento deve già esistere un menu di collegamento. Se fate clic sul pulsante Vai, si apre il collegamento selezionato nel menu. Di solito, non è necessario associare un pulsante Vai al menu di collegamento: infatti, quando si seleziona una voce da un menu di collegamento, l'URL corrispondente viene caricato automaticamente. Se invece selezionate la stessa voce già selezionata nel menu di collegamento, il collegamento non viene effettuato. In generale questo non ha importanza, ma se il menu di collegamento appare in un frame e le relative voci rimandano a pagine contenute in altri frame, un pulsante Vai può essere utile per consentire ai visitatori di scegliere di nuovo una voce che è già selezionata nel menu di collegamento.
Nota:
quando usate un pulsante Vai con un menu di collegamento, il pulsante Vai diventa l'unico meccanismo che consente all'utente di accedere all'URL associato alla selezione effettuata nel menu. La selezione di una voce di menu nel menu di collegamento non esegue più il reindirizzamento automatico dell'utente a un'altra pagina o frame.
Utilizzate il comportamento Apri finestra browser per aprire una pagina in una nuova finestra. Potete specificare le proprietà della nuova finestra, tra cui le dimensioni, gli attributi (se è ridimensionabile, se è provvista di una barra dei menu e così via) e il nome. Ad esempio, potete utilizzare questo comportamento per aprire un'immagine più grande in una finestra separata quando il visitatore fa clic su un'immagine in miniatura; con questo comportamento, potete far corrispondere esattamente le dimensioni della nuova finestra a quelle dell'immagine.
Se non specificate alcun attributo, la nuova finestra assume le dimensioni e gli attributi della finestra da cui è stata aperta. L'impostazione di qualunque attributo per la finestra comporta la disattivazione automatica di tutti gli altri attributi che non siano stati espressamente attivati. Ad esempio, se non impostate alcun attributo, la nuova finestra potrebbe avere una larghezza di 1024 pixel e un'altezza di 768 pixel e contenere una barra degli strumenti di navigazione (contenente i pulsanti Indietro, Avanti, Inizio e Ricarica), una barra degli strumenti di posizione (che mostra l'URL), una barra di stato (che visualizza i messaggi di stato, nella parte inferiore) e una barra dei menu (contenente i menu File, Modifica, Visualizza e altri ancora). Se impostate esplicitamente la larghezza e l'altezza su 640 e 480 e non specificate altri attributi, la finestra viene aperta con il formato 640 pixel per 480 pixel e non contiene alcuna barra degli strumenti.
-
Impostate la larghezza e l'altezza della finestra (in pixel) e incorporate le varie barre degli strumenti, barre di scorrimento, maniglie di ridimensionamento e così via. Assegnate un nome alla finestra (non utilizzate spazi o caratteri speciali) se desiderate impostarla come destinazione di collegamenti oppure controllarla mediante JavaScript.
Il comportamento Messaggio popup visualizza una finestra di avvertimento JavaScript che contiene il messaggio specificato. Poiché le finestre di avvertimento JavaScript contengono un solo pulsante (OK), questo comportamento deve essere utilizzato per fornire informazioni e non per presentare una scelta.
Potete incorporare nel testo qualunque espressione JavaScript valida, come chiamate di funzione, proprietà, variabili globali o altro. Per incorporare le espressioni JavaScript, mettetele tra parentesi graffe ({}). Per visualizzare una parentesi graffa, fatela precedere da una barra rovesciata (\{).
Esempio:
The URL for this page is {window.location}, and today is {new Date()}.
Nota:
il browser controlla l'aspetto dell'avvertimento. Per avere un maggiore controllo sull'aspetto, valutate la possibilità di utilizzare il comportamento Apri finestra browser.
Il comportamento Precarica immagini riduce la durata di visualizzazione memorizzando nella cache le immagini che non vengono mostrate immediatamente quando viene visualizzata la pagina (ad esempio, quelle che vengono scambiate per mezzo di comportamenti o script).
Nota:
se selezionate la casella di controllo Precarica immagini nella finestra di dialogo Scambia immagine, il comportamento Scambia immagine precarica automaticamente tutte le immagini evidenziate e pertanto non è necessario utilizzare il comportamento Precarica immagini.
Il comportamento Imposta testo del frame consente di sostituire il contenuto e la formattazione di un frame con il contenuto desiderato. Tale contenuto può essere costituito da qualunque codice HTML valido. Utilizzate questo comportamento per visualizzare informazioni in modo dinamico.
Normalmente, quando utilizzate il comportamento Imposta testo del frame, la formattazione di un frame viene sostituita. Tuttavia, potete conservare gli attributi di sfondo della pagina e colore del testo selezionando Mantieni colore di sfondo.
Potete incorporare nel testo qualunque espressione JavaScript valida, come chiamate di funzione, proprietà, variabili globali o altro. Per incorporare le espressioni JavaScript, mettetele tra parentesi graffe ({}). Per visualizzare una parentesi graffa, fatela precedere da una barra rovesciata (\{).
Esempio:
The URL for this page is {window.location}, and today is {new Date()}.
Il comportamento Imposta testo del contenitore consente di sostituire il contenuto e la formattazione di un contenitore esistente (ovvero di qualunque elemento che possa contenere testo o altri elementi) con il contenuto specificato. Tale contenuto può essere costituito da qualunque codice di origine HTML valido.
Potete incorporare nel testo qualunque espressione JavaScript valida, come chiamate di funzione, proprietà, variabili globali o altro. Per incorporare le espressioni JavaScript, mettetele tra parentesi graffe ({}). Per visualizzare una parentesi graffa, fatela precedere da una barra rovesciata (\{).
Esempio:
The URL for this page is {window.location}, and today is {new Date()}.
L'azione Imposta testo barra di stato consente di visualizzare un messaggio nella barra di stato situata nell'angolo inferiore sinistro della finestra del browser. Ad esempio, potete utilizzare questo comportamento per visualizzare la destinazione di un collegamento anziché l'URL. I visitatori spesso ignorano o non notano i messaggi contenuti nella barra di stato e non tutti i browser consentono di impostare il testo; se il messaggio è importante, è opportuno visualizzarlo come messaggio a comparsa o come testo di un elemento PA.
Nota:
se usate il comportamento Imposta testo della barra di stato in Dreamweaver, non è garantito che il testo della barra di stato del browser cambi, perché alcuni browser richiedono regolazioni speciali per la modifica del testo della barra di stato. Firefox, ad esempio, richiede la modifica di un'opzione avanzata che consente a JavaScript di modificare il testo della barra di stato. Per ulteriori informazioni, consultate la documentazione del browser.
Potete incorporare nel testo qualunque espressione JavaScript valida, come chiamate di funzione, proprietà, variabili globali o altro. Per incorporare le espressioni JavaScript, mettetele tra parentesi graffe ({}). Per visualizzare una parentesi graffa, fatela precedere da una barra rovesciata (\{).
Esempio:
The URL for this page is {window.location}, and today is {new Date()}.
Il comportamento Imposta testo del campo di testo consente di sostituire il contenuto del campo di testo di un modulo con il contenuto specificato.
Potete incorporare nel testo qualunque espressione JavaScript valida, come chiamate di funzione, proprietà, variabili globali o altro. Per incorporare le espressioni JavaScript, mettetele tra parentesi graffe ({}). Per visualizzare una parentesi graffa, fatela precedere da una barra rovesciata (\{).
Esempio:
The URL for this page is {window.location}, and today is {new Date()}.
Il comportamento Mostra-nascondi elementi consente di eseguire una serie di operazioni per uno o più elementi di pagina, ad esempio visualizzarli, nasconderli e ripristinarne la visibilità predefinita. Questo comportamento può essere utilizzato anche per visualizzare una serie di informazioni mentre l'utente interagisce con la pagina. Ad esempio, se l'utente sposta il cursore sull'immagine di una pianta, potete visualizzare un elemento di pagina che indica la stagione di fioritura della pianta, le dimensioni che può raggiungere, la quantità di sole necessaria e così via. Il comportamento si limita a visualizzare o nascondere l'elemento pertinente, non lo rimuove dal flusso della pagina quando è nascosto.
Il comportamento Scambia immagine sostituisce un'immagine a un'altra, modificando l'attributo src del tag <img>. Questo comportamento può essere utilizzato per creare oggetti rollover e altri effetti visivi (compreso lo scambio di più immagini alla volta). Se inserite un'immagine di rollover, viene automaticamente aggiunto il comportamento Scambia immagine alla pagina.
Nota:
poiché questo comportamento modifica solo l'attributo src, l'immagine di scambio deve avere le stesse dimensioni (altezza e larghezza) dell'immagine originale. In caso contrario, l'immagine inserita viene ridotta o ingrandita in modo da corrispondere alle dimensioni dell'originale.
È inoltre disponibile il comportamento Ripristino immagini scambiate, che ripristina i file di origine precedenti per l'ultima serie di immagini scambiate. Poiché questo comportamento viene aggiunto automaticamente quando applicate a un oggetto il comportamento Scambia immagine, non è necessario attivarlo manualmente se avete lasciato selezionata l'opzione Ripristina durante l'applicazione di Scambia immagine.
Il comportamento Convalida modulo analizza il contenuto dei campi di testo specificati dall'utente per verificare che sia stato inserito il tipo di dati corretto. Questo comportamento può essere applicato ai singoli campi di testo con l'evento onBlur per convalidare i campi man mano che vengono compilati dall'utente, oppure può essere applicato a tutto il modulo con l'evento onSubmit per verificare più campi di testo contemporaneamente quando l'utente fa clic sul pulsante di invio. Nel secondo caso si evita di inviare al server un modulo che contiene dati non validi.
-
Se desiderate convalidare i singoli campi man mano che vengono compilati, selezionate un campo di testo e scegliete Finestra > Comportamenti.
Se desiderate convalidare più campi al momento dell'invio del modulo, fate clic sul tag <form> nel selettore situato nell'angolo inferiore sinistro della finestra del documento e selezionate Finestra > Comportamenti.
-
-
Se state convalidando campi singoli, verificate che l'evento predefinito sia onBlur oppureonChange. In caso contrario, selezionate uno di questi eventi.
Entrambi gli eventi attivano il comportamento Convalida modulo quando l'utente allontana il cursore dal campo. La differenza tra i due è che onBlur si verifica indipendentemente dal fatto che il campo sia stato compilato o meno, mentre onChange si verifica solo se è stato modificato il contenuto del campo. L'evento onBlur è preferibile se il campo è stato specificato come obbligatorio.
I post su Twitter™ e Facebook non sono coperti dai termini di Creative Commons.