-->

CURSORI CON SCRITTA E GIFFINA

Mi sono intestardita con i codici
per i Gadget  HTML/JAVASCRIPT
Per me che sono alle prime esperienze
c'è da perderci la testa.
Ho trovato in rete tanti turorial per creare
tante cosine simpatiche, come orologi, datari,
lunari, calendari ecc ecc, tanti li sto
ancora studiando e provando
Il proverbio dice...."chi la dura, la vince"
e io sono  "de coccio" !!!!

Ora provo a proporre il cursore con la scritta

e se vuoi, puoi aggiungere un piccola gift
E' un sistema carino per personalizzare il tuo
blog o sito web, quando i tuoi amici vi
entreranno muovendo il mouse si noterà una
simpatica scritta che deciderai tu
Vediamo come fare

Il codice si divide in 2 parti:
1 - le "Istruzioni Javascript " che vanno inserite
tra i Tag  <head> e </head>
2 - una parte da postare sotto il tag <body>

 inserisci questa parte tra <head> e </head> 

<script type="text/javascript" language="JavaScript">
// Autore sconosciuto 
// cercato e riscritto da http://www.dreamworldgraphic.blogspot.it
function checkBrowser(){
this.ver=navigator.appVersion
this.dom=document.getElementById?1:0
this.ie5=(this.ver.indexOf("MSIE 5")>-1 & this.dom)?1:0;
this.ie4=(document.all & !this.dom)?1:0;
this.ns5=(this.dom & parseInt(this.ver) >= 5) ?1:0;
this.ns4=(document.layers & !this.dom)?1:0;
this.bw=(this.ie5 || this.ie4 || this.ns4 || this.ns5)
return this
}
bw=new checkBrowser()
fromLeft=10
fromTop=10
function cursorInit(){
oCursor=new makeCursorObj('divCursor')
scrolled=bw.ns4 || bw.ns5?"window.pageYOffset":"document.body.scrollTop"
if(bw.ns4)document.captureEvents(Event.MOUSEMOVE)
document.onmousemove=move;
}
function makeCursorObj(obj,nest){
nest=(!nest) ? '':'document.'+nest+'.' 
this.css=bw.dom? document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?eval(nest+"document.layers." +obj):0; 
this.moveIt=b_moveIt; 
return this
}
function b_moveIt(x,y){this.x=x; this.y=y; this.css.left=this.x; this.css.top=this.y}
function move(e){
x=bw.ns4 || bw.ns5?e.pageX:event.x
y=bw.ns4 || bw.ns5?e.pageY:event.y
if(bw.ie4 || bw.ie5) y=y+eval(scrolled)
oCursor.moveIt(x+fromLeft,y+fromTop)
}
onload=cursorInit;
</script>




Questa parte va inserita sotto il tag <body>
<div id="divCursor">Testo</div>

il testo è a tuo piacere 
è contenuto in un div, quindi possiamo personalizzare 
a nostro gusto i parametri dello style, qui di seguito
troverai un codice per il font, tipo, colore e misura, 
se necessario possiamo cambiare anche
le misure del contenitore, ma attenzione è meglio  
non esagerare,  fallo piccolo e inserisci una brevissima 
frase o saluto, e magari una minuscola gif, come nel 
mio blog. 


 Ecco i parametri per lo style del div 
contenitore , si tratta di CSS
e vanno  inseriti tra i tag <head> e </head>


<style type="text/css">
#divCursor{
position:absolute; 
width:70px; 
height:15px;
font-family: "Arial"; 
font-size: 7pt;
color:#000000;
}
</style>


(color 000000 sta per nero)
(font-family: "Arial";  puoi scegliere fra i font standard)

Subito sotto il tag <body> inserisci i parametri 
che ne permettono la visualizzazione

<div id="divCursor">Testo</div>

Ora hai la tua scritta ben visibile
e scorrevole al movimento del mouse

Se vuoi puoi aggiungere una giffina
aggiungendo questo codice al posto
di quello sopra

<div id="divCursor"><img border="0" src="url immagine" width="15" height="15" alt="">
Testo</div>

in rosso è evidenziato il punto in cui
devi inserire l'url della tua gift

Buon divertimento
Ciao



Nessun commento: