Il Menu Spry era uno degli elementi Widget Spry aggiunti a Dreamweaver nella versione CS3. CS4 include 16 diversi widget come questo per migliorare l'aspetto delle pagine Web e semplificare tali cose come l'aggiunta di funzionalità di user ID e password. La versione di barra di menu in Spry offre l'opportunità di scelte di menu o navigazione di pila fino a tre livelli, fornendo maggiore flessibilità rispetto a codificazione di base HTML, o Hypertext Markup Language. Utilizzando i fogli di stile CSS, o CSS, costruito in Spry permette il controllo diretto su più elementi di visualizzazione.

Istruzioni

1

Aprire il programma software di Dreamweaver e aprire una pagina con un Menu Spry esistente. Spostare il cursore su qualsiasi area della barra dei menu. In questo modo il Widget Spry del pannello visibile con uno sfondo blu e testo lettura "Spry Menu Bar: MenuBar1" (supponendo che hai solo un menu sulla pagina e non hanno cambiato titolo). Le proprietà sono elencate nel pannello nella parte inferiore dello schermo.

2

Cambiare il look del menu cliccando su "Personalizza questo widget" a sinistra del pannello Proprietà. Si aprirà una finestra sullo schermo Adobe Help con tutti i dettagli su come 1) cambiare lo stile di testo di una voce di menu; 2) cambiare il colore di sfondo di una voce di menu; 3) cambiare la dimensione delle voci di menu; e 4) Posizionare i sotto-menu. All'interno di queste quattro possibilità, cinque diverse modifiche esistono solo per lo stile di testo. Ciascuno di essi comporta più regole CSS per un totale di 10 più cinque proprietà di colore diverso per main e sub-menu. Descrivere tutti questi va oltre i limiti di questo articolo, ma alcuni esempi illustrano il processo di base.

3

Modificare il colore di sfondo di una voce di menu individuando gli stili CSS appropriati elencati nella pagina di Adobe. Lo stile per questo è "ul. MenuBarVertical un "o"ul. MenuBarHorizontal una. " Il colore predefinito è "#EEE." Clicca sulla sezione "Stili CSS" sulla destra dello schermo. Fare clic sul segno "più (+)" accanto a "Disponibili" per espandere tutti gli stili per questo (o barra verticale). Scorrere verso il basso fino a trovare "ul. MenuBarHorizontal un "e fare clic su di esso. Verrà visualizzata la finestra Proprietà. Fare clic sul colore predefinito, che si aprirà una tabella di colore. Selezionare un nuovo colore dal grafico.

4

Ridimensionare le dimensioni delle voci di menu utilizzando lo stile CSS applicabile sulla pagina della Guida di Adobe e il metodo descritto nel passaggio 3. Le dimensioni della barra di Menu orizzontale sono controllate da CSS stile "ul. MenuBarHorizontal li"dove è possibile modificare la proprietà width. In modo simile, un altro CSS stile controlli lo stile del testo. Questo è il "ul. MenuBarHorizontal un "o"ul. Stile di MenuBarVertical r.". Modificare il colore del testo quando il puntatore del mouse passa sopra il menu con il "ul. MenuBarHorizontal un: al passaggio del mouse "(o l'equivalente verticale).

Consigli & Avvertenze

• Come alternativa alla modifica degli stili CSS, fare clic su "HTML" nella sezione proprietà o "Codice sorgente" nel menù superiore. È quindi possibile modificare aspetto utilizzando tag HTML come font e il colore. Questo metodo di ridurre il numero di modifiche di stile possibile rispetto all'utilizzo di CSS.
• Widget Spry creano più file JavaScript e CSS. Questi devono essere caricati al server Web insieme alla pagina Web prima che il widget funzionerà.
• Essere prudenti come si sperimentare con cambiamenti di colore. Non impostare colori che rendono il testo difficile da leggere su un altro monitor di visualizzazione. Ad esempio, se fai il colore di sfondo del menu vuoto e il colore di sfondo al passaggio del mouse giallo chiaro, il testo può essere vicino illeggibile.