WebLink il miniportale per costruire e fare pagine web

Il Sito per imparare gratuitamente a fare pagine Web
Oggi: Venerdì 10 Febbraio 2012 Ore: 06:25

Home · XHTML con Style · Primi Passi · Guida HTML · Guida CSS · F.A.Q. · Scripting · Applets · Grafica Web ·

Forum · Comunicazioni

Web-Link

Libera Donazione

180 Scripts

·Effetti sul Cursore
·Effetti sui links
·Effetti sul testo
·Effetti su immagini
·Protezioni varie
·Gestione finestre
·Animazioni
·Date e Calendari
·Orologio ed Orario
·Messaggi e frasi
·Menù navigazione
·Banners
·Scritte sulle Barre
·Decorazioni
·Utilità varie
·Cookies
·Motore Ric.Interno
·Forma o Moduli
·Reindirizzamento
·Multimedialità

Fare Web

·Applets
·Banners
·Blog
·Chat
·Contatori
·DHTML
·E-Commerce
·Editors CSS
·Editors HTML
·Flash
·Forum
·F.T.P.
·Guestbooks
·Grafica
·Iscriz.Mot.Ricerca
·Java Applets
·Java Script
·Mailling List
·Mappe Cliccabili
·Meta Tags
·Mot.ricerca interno
·Scripting
·Sondaggi on-line
·Spazi Web
·Tag Boards
·Validatori HTML
·W3C Specifiche
·Web Designer
·Web Master

Links che nevicano.

Crediti: Peter Gehrig
Name: info@24fun.ch
Website: www.24fun.com

Descrizione: Links ad effetto se ne vedono molti, questo per esempio genera una nevicata al solo passaggio del mouse:

Provate a portare il puntatore del mouse sopra a questo link e guardate cosa succede.

Il tutto funziona con i browser: IE5x/6x, NS6x/7x, Mozilla 1x, Opera 7x.

Passo 1 :

Selezionare tutto il codice cliccando sul pulsante grigio, quindi posizionatevi sul testo evidenziato, adoperate il tasto destro del mouse per l'operazione di copia ed incolla, non vi rimane che trasferire il tutto nella vostra pagina web, in questo caso immediatamente prima del tag: di chiusura </body>

// IMPORTANT:
// If you add this script to a script-library or script-archive
// you have to add a highly visible link to
// http://www.24fun.com on the webpage
// where this script will be featured

///////////////////////////////////////////////////////////////////////////
// CONFIGURATION STARTS HERE
///////////////////////////////////////////////////////////////////////////

// Set the number of snowflakes (more than 30 - 40 not recommended)
var snowmax=35

// Set the colors for the snow. Add as many colors as you like
var snowcolor=new Array("#aaaacc","#ddddFF","#ccccDD")

// Set the fonts, that create the snowflakes. Add as many fonts as you like
var snowtype=new Array("Arial Black","Arial Narrow","Times","Comic Sans MS")

// Set the letter that creates your snowflake (recommended:*)
var snowletter="*"

// Set the speed of sinking (recommended values range from 0.3 to 2)
var sinkspeed=0.6

// Set the maximal-size of your snowflaxes
var snowmaxsize=22

// Set the minimal-size of your snowflaxes
var snowminsize=8

// Set the width of the snowing-zone (pixels)
var snowboxwidth=100

///////////////////////////////////////////////////////////////////////////
// CONFIGURATION ENDS HERE
///////////////////////////////////////////////////////////////////////////

// Do not edit below this line
var snow=new Array()
var marginbottom
var marginright
var marginleft
var margintop
var snowingzone=1
var posleft
var postop
var is_snowing=false
var timer
var i_snow=0
var x_mv=new Array();
var crds=new Array();
var lftrght=new Array();
var browserinfos=navigator.userAgent 
var ie5=document.all&&document.getElementById&&!browserinfos.match(/Opera/)
var ns6=document.getElementById&&!document.all
var opera=browserinfos.match(/Opera/)  
var browserok=ie5||ns6||opera

function randommaker(range) {		
	rand=Math.floor(range*Math.random())
    return rand
}

function stopsnow() {
	is_snowing=false
}

function getcoordinates(e) {
	if (ie5 || opera) {
		posleft=document.body.scrollLeft+window.event.x;
		postop=document.body.scrollTop+window.event.y;
	}
	if (ns6) {
		posleft=e.pageX
		postop=e.pageY
	}
}

for (i=0;i<=snowmax;i++) {
	document.write("<span id='s"+i+"' style='position:absolute;top:-"+snowmaxsize+"'>"+snowletter+"</span>")
}
if (browserok) {
	document.onmousemove=getcoordinates
}
</script>

Passo 2:

Adesso si deve aggiungere ai vari links il comando onMouseOver che richiama l'effetto.

Selezionare tutto il codice cliccando sul pulsante grigio, quindi posizionatevi sul testo evidenziato, adoperate il tasto destro del mouse per l'operazione di copia ed incolla, non vi rimane che trasferire il tutto nella vostra pagina web, ovviamente modificate il link e la frase da esplodere.

Note :

E' possibile configurare la velocità, le dimensioni, i colori, il tipo di font ed il numero di fiocchi che formano la nevicata. Nelle prime righe di codice dello script trovate le variabili:

var snowmax=35 = numero di fiocchi che formano la nevicata.

var snowcolor=new Array("#aaaacc","#ddddFF","#ccccDD") = colori in codice esadecimale dei fiocchi di neve.

var snowtype=new Array("Arial Black","Arial Narrow","Times","Comic Sans MS") = il tipo di font adoperato per il carattere dei fiocchi di neve.

var snowletter="*" = il carattere adoperato per il fiocco di neve.

var sinkspeed=0.6 = la velocità con la quale scende la neve.

var snowmaxsize=22 = la dimensione max del fiocco più grande.

var snowminsize=8 = la dimensione min del fiocco più piccolo.

var snowboxwidth=100 = la dimensione della zona interessata alla nevicata.

Elenco completo degli script.

Libera Donazione

Potete fare domande e discutere l'argomento sul Forum

Risorse

· Forum

· F.A.Q.
· Frames
· Scripting
· Applets
· Grafica Web
· Banner Exchange
· Novità

Servizi

· Web-Link Award
· I Files Scaricati
· Segnala il sito
· Leggi Guestbook
· Firma Guestbook
· Banners

Linguaggi

· A.J.A.X.
· A.S.P.
· C.G.I.
· C.S.S.
· Flash
· H.T.M.L.
· X.H.T.M.L.
· Java
· JavaScript
· P.E.R.L.
· P.H.P.
· X.M.L.

Download

· Primi Passi
· Guida HTML
· Guida CSS
· Guida XHTML

Home Page ·

Aggiungi ai preferiti ·

Imposta come Pagina Iniziale ·

Segnala il sito ai tuoi amici ·

Questa pagina è esclusiva proprietà di © Web-Link © Andrea Bianchi 1997 ~ 2012
Vietata la copia e la distribuzione, anche parziale, senza la previa autorizzazione scritta di Web-Link