Come creare un cursore personalizzato per Blogger che funzioni anche con Internet Explorer.

Nell'articolo precedente ho parlato di come si possa modificare l'aspetto del cursore quando punta un determinato link. In articoli passati mi sono occupato più volte della personalizzazione di cursori, c'era sempre però il problema che questi non si visualizzavano correttamente con Internet Explorer. La ragione risiede nel fatto che IE riconosce come cursore solo immagini in formato ANI (absit iniura verbis) che sono di difficile reperimento. Gli altri browser invece funzionano con i formati più classici come GIF, PNG o JPG.

Per creare un cursore che sia visibile nello stesso modo da tutti i browser, dobbiamo quindi avere una stessa immagine con due formati diversi. I cursori gratuiti possono essere trovati nell'interessante portale Totally Free Cursors in cui ne sono presenti una infinità, suddivisi in categorie che vanno dagli animali ai segni dello zodiaco. Quando abbiamo individuato il cursore che ci interessa, dobbiamo scaricare l'immagine normale, solitamente in GIF, e quella da utilizzare per Internet Explorer che è, come già detto, in formato ANI.

Nel primo caso si clicca con il destro del mouse sul cursore quindi si sceglie Salva immagine con nome. Per il formato ANI si clicca su Download Nome Cursore, come mostrato nei due screenshot precedenti.

Caricare su un hosting una immagine in GIF non è di nessuna difficoltà visto che si può utilizzare Picasa o SkyDrive ma il formato ANI, che io sappia, è accettato solo da DropBox. Se non siete ancora registrati a DropBox lo potete fare adesso attraverso questo modulo.

I due file immagini devono quindi essere caricati nella cartella Public di DropBox oppure in una sottocartella inserita sempre però in Public. Solo in questo caso se ne potrà acquisire il link diretto con il procedimento indicato nel post richiamato sopra. 

Acquisiti i due hotlink si va su Design > Modifica HTML e si cerca la riga </body>. Immediatamente sopra si incolla questo codice

<!--CURSORE PERSONALIZZATO INIZIO-->
<style>HTML,BODY{cursor: url(&quot;http://dl.dropbox.com/u/2574553/cursori/blackglitter.ani&quot;), url(&quot;http://dl.dropbox.com/u/2574553/cursori/blackglitter.gif&quot;), auto;}</style>
<!--CURSORE PERSONALIZZATO FINE - www.ideepercomputeredinternet.com-->

I due URL evidenziati in rosso dovranno essere sostituiti da quelli del vostro cursore ottenuti da DropBox. Salvate il modello e visualizzate il risultato

• Demo del cursore personalizzato Black Glitter -