Pagina aggiornata... Lunedì, 08 gennaio 2024 * Tempo di caricamento 0.89 secondi
Link navigazione : Home telaioHome ~ Tutorial ~ Html » Cursore

..:: Il cursore ::..

Se vogliamo abbellire le nostre pagine non possiamo assolutamente trascurare "il cursore"
possiamo trasformarlo come e dove vogliamo, semplicemente variando la forma,
sostituirlo con piccole gif o addirittura affiancarlo ad una scritta...

Basterà inserire dei semplici tag, a seconda del cursore che ci serve o ci piace, per avere
quello giusto al posto giusto^^ Iniziamo quindi dalle basi, ovvero i parametri standard
per i cursori nelle pagine web, utilizzati principalmente per evidenziare i link.

# Passate il mouse sopra i nomi dei cursori per vedere l'effetto

default
crosshair
move
hand
help
text
wait
progress
pointer
     
ne-resize
sw-resize
nw-resize
se-resize
n-resize
s-resize
e-resize
w-resize

Con l'arrivo dei nuovi "css.3" abbiamo questi altri parametri,
ma al momento non sono supportati da tutti i browser

copy
alias
cell
no-drop
all-scroll
not-allowed
col-resize
row-resize
vertical-text

- Per personalizzare il cursore su tutta la pagina,
inseriremo l'apposito parametro nello style del body direttamente dai css:

<style type="text/css">
body{cursor: nome cursore;}
</style>

Ovviamente agendo sui css potremmo stabilire un determinato cursore per vari
parametri della pagina, tipo i link, i titoli, il testo ecc. ecc. aggiungendo appunto allo style
di questi parametri anche lo style del cursore.

- Se preferite, potete inserire lo style del cursore direttamente in linea quando vi occorre,
ad esempio in un paragrafo, un div o in una table:

<p style="cursor:not-allowed">Passa su con il mouse...</p>

<div style="cursor:help">Passa su con il mouse...</div>


<table border="1" width="90%">
<tr>
<td style="cursor:s-resize">Passa su con il mouse...</td>
</tr>
</table>

Cursore e immagini

Se desideriamo personalizzare il cursore con un'immagine dobbiamo utilizzare un tag particolare,
perché è necessario inserire l'url della pagina dell'immagine e immagini con estensioni
diverse affinché si visualizzi con i vari tipi di browser.

Internet Explorer riconosce come parametro valido solo un immagine con estensione .cur,
gli altri browser, Firefox, Chrome, Opera ecc. ecc. non hanno problemi e visualizzano immagini con
estensione gif, png o jpg anche se, ad esempio con Crome si perde l'animazione nelle immagini gif.

- Ecco il tag da inserire nelle pagine, direttamente nel tag <body>

<body style="cursor: url('url_immagine.gif'), url('url_immagine.cur'), default;">

Passa qui con il mouse per vedere l'effetto^^

Be' direi che è abbastanza semplice e pratico, non ci vuole molto a rinominare una gif in .cur
ed avere così il cursore che vogliamo sulle nostre pagine... e su tutti browser ^_^

Nel menu "Script page" trovate vari modi per personalizzare il cursore in modo
più evidente utilizzando delle magiche stelle o delle scrittine...

Nel telaio trovi tanti mini cursori pronti da usare nelle tue pagine --> Mini cursori

Spero di essere stata chiara in tutti i passaggi ^_^
Vi auguro buon lavoro ma sopratutto buon divertimento!
Ciao alla prossima^^ Penelope ♥


Dai un giudizio a questo tutorial... Grazie ^_^




88.46%
Voti totali: 26
Rating... 5





Commentario...

Scrivi qui per lasciare un saluto, una richiesta di aiuto,
un suggerimento o una critica ^_^

Nickname
Home page
B i U   ^_^ o_O O_O *_* Gif...

  

I vostri commenti in questa pagina...


maurorosati52 ~ HomePage
28/08/2014 22:20:44
salve avrei bisogno di aiuto essendo alle primisime armi vrrei mettere nel puntatore una scritta, non riesco neanche x sogno, ho provato una decina di volte ma niente vorrei che su ogni pagina sia diverso
Claudia di Pietro
01/07/2014 22:06:42
Ciauu ♥ Ti volevo chiedere, se mi potevi fare un cursore con un gattino animato e con scritto :Bluevet <--- Grazie mille !! Se lo fai contattami a pallina123.cdp@gmail.com


~ Pagina visitata da 3628 utenti


 H: 
Buona Primavera e ...buon weekend!





Segui il telaio su Facebook

Privacy Policy Cookie Policy

* Info sezione...

Mi farebbe molto piacere la condivisione
dei miei tutorial ma vi sarei anche molto grata
se evitaste di fare copia e incolla su altri spazi
del mio lavoro, linkate le pagine, avvisatemi
ricambierò senza problemi. Grazie ♥

..:: Basi ::..



..:: html ::..





..:: Script page ::..



..:: Script gadget ::..


Accessori e gadget del telaio...


Spazio web...

Realizzare e gestire un sito web
nell'hosting free più famoso...

Un sito su Altervista

Materiale grafico

Gif, mini gif, pixel, immagini, png...
Tutto il materiale grafico che ti serve,
raccolto e messo a tua disposizione!

Gif & co...




I vostri messaggi...

Grazia
09/03/2025 18:13:32
Ciao Penny, sono passata a lasciarti un salutino di buona domenica ed anche a ringraziarti per aver inserito il mio bannerino. Un abbraccio forte ed alla prossima :) Ciaooo
ೡ Scritto in... Home
 
Gabriella
07/03/2025 12:04:36
Ciao Penny, visto che usufruisco spesso delle tue lezioni di codici e html ho preso i tuoi banner ;) Grazie e un abbraccio
ೡ Scritto in... Banner link del telaio ^_^
 
Mamyr
06/03/2025 13:34:06
Ciao Penelope, grazie per questo tuo sito meraviglioso e molto utile, ho prelevatoL'almanacco in table -blu- per inserirlo nel mio blog. Inserirò anche il tuo banner, grazie ancora e buona giornata.
ೡ Scritto in... Almanacco in table
 
Pinalie
03/03/2025 01:38:03
Oh sweet Penelope .. im sorry you can make no comment yet on my pageim still working to make it fit to goi hope end summer it will be done, i hope whoo!i instalt a new clock from you.. love your clocks so much thank you so much again for your lovley giftmy derest greetings ♥♥♥
ೡ Scritto in... Orsetti...
 
Grazia
26/02/2025 09:43:32
Ciao carissima Penelope, come stai? E' da tanto che non ci sentiamo. Qui è sempre tutto meraviglioso! Sono passata a prelevare un tuo banner da inserire nel mio nuovo spazio web, alla fine sono riuscita ad inaugurare quel "famoso" sito statico in cui offro piccole utilità grafico/digitali agli utenti e l'ho chiamato Dreamland...mi ci è voluto un po' ma sono partita col progetto...dai che così magari ci sentiamo più spesso. Ancora complimenti, un abbraccio e sereno proseguimento di giornata ♥
ೡ Scritto in... Home
 
ೡPenelope ♥
18/02/2025 20:27:41
Dear Pinalie thank you so much, I couldn't leave a message in your space, a big hug ♥
ೡ Scritto in... Orsetti...
 
ೡPenelope ♥
18/02/2025 20:16:52
Cara Filo d'arianna ti ringrazio tanto, fammi sapere quando avrai un tuo spazio così da poter ricambiare, una abbraccio forte ♥
ೡ Scritto in... Banner link del telaio ^_^
 
Antonella
13/02/2025 01:00:16
ciao Penelope ho prelevato uno dei tuoi almanacchi e l'ho inserito nel mio blog.Complimenti per il tuo sito sempre ricco e interessante.[Link]
ೡ Scritto in... Almanacco soft
 
Vale
02/02/2025 06:15:22
carinissimi!!♥
ೡ Scritto in... Mini cursori
 
Pinalie
19/01/2025 22:47:05
Deer Penelope i love and instal your sweet little bear Date Time on my pageThank you so much for your work
ೡ Scritto in... Orsetti...