|
Finestrella pop up per descrivere i links  
Crediti:
Name: Mike Mcgrath
Website: http://website.lineone.net
Descrizione: Aggiunge una finestrella personalizzabile a quei links che necessitano di ulteriori spiegazioni. Per ottenere questo effetto oltre allo script, si fa uso di una definizione di style e degli eventi: onmouseover e onmouseout associati al link stesso, per cui risulta leggermente laborioso specie per chi non ha dimestichezza con html.
Laborioso non significa impossibile, basta seguire attentamente tutti i vari passaggi sotto descritti.
Questo un esempio: link con finestrella di descrizione
Passo 1 - Style :
Selezionare tutto il codice cliccando sulla forbice, quindi posizionandovi sul testo evidenziato adoperate il tasto destro del mouse per l'operazione di copia ed incolla, non rimane che trasferire il tutto nella vostra pagina web, in questo caso fra i tags: <head> e </head>.
Passo 2 - HTML : Immediatamente dopo la definizione (tag) dell'elemento <body> inserite questa riga di codice html:
Stessa procedura: selezionare tutto il codice nella finestra sotto, cliccando sulla forbice, quindi posizionatevi sul testo evidenziato e adoperare il tasto destro del mouse per l'operazione di copia ed incolla, trasferitelo nella vostra pagina web, in questo caso subito dopo il tag: <body>
Passo 3 - SCRIPT : Adesso all'interno degli elementi (tags)
<body> </body> deve essere posizionato lo script:
Stessa procedura: selezionare tutto il codice nella finestra sotto, cliccando sulla forbice, quindi posizionatevi sul testo evidenziato e adoperare il tasto destro del mouse per l'operazione di copia ed incolla, trasferitelo nella vostra pagina web, in questo caso all'interno dei tags: <body> e </body>
All'interno dello script ci sono i parametri per poter variare le dimensioni della finestra, la sua posizione e i colori, oltre alle dimensioni e ai colori del font di scrittura.
Chi ha dimestichezza con html riconoscerà questi parametri che sono:
TABLE WIDTH=180 : larghezza finestra
BORDER=1 : spessore bordo
BORDERCOLOR=#98ccff : colore bordo
FONT COLOR=Green SIZE=3 : colore e dimensione del font di scrittura
Oltre a questi paramente esiste anche la possibilità di cambiare il colore dello sfondo, agendo sul prossimo blocco di codice, quello relativo al link stesso.
Passo 4 - HTML : Non resta che introdurre gli eventi onmouseover e onmouseout a tutti i link che necessitano di una finestrella pop up. I Links vanno inseriti all'interno della propria pagina web nella zona <body> allo stesso identico modo di qualsiasi altro link.
Stessa procedura: selezionare tutto il codice nella finestra sotto, cliccando sulla forbice, quindi posizionatevi sul testo evidenziato e adoperare il tasto destro del mouse per l'operazione di copia ed incolla, trasferitelo nella vostra pagina web, in questo caso dopo i tags: <body> e <body>
E' abbastanza intuitivo dove inserire il testo che dovrà comparire a video, praticamente al posto della scritta: messaggio personalizzato sulla finestrella del link. Mentre il numero esadecimale che segue, è relativo al colore dello sfondo e può essere sostituito con qualsiasi altro colore valido in html.
Note : Questi sotto alcuni esempio associati a link diversi:
Esempio link 1
Esempio link 2
Esempio link 3
 Elenco completo degli script.
Libera Donazione
Potete fare domande e discutere l'argomento sul Forum
|
Home ·
XHTML con Style ·
Primi Passi ·
Guida HTML ·
Guida CSS ·
F.A.Q. ·
Scripting ·
Applets ·
Grafica Web ·
Forum ·
Comunicazioni 
Home Page ·
Aggiungi ai preferiti ·
Segnala il sito ai tuoi amici ·
