Hoe verander je de standaard muisaanwijzer met behulp van een eigen cursor? Dit is geen enkel probleem. Er zijn twee soorten cursors. Statische (.cur formaat) en bewegende (.ani formaat) cursors. Je kunt zelf cursors maken met de daarvoor beschikbare softwarepakketten. Enkele voorbeelden hiervan zijn axialis.com en aha-soft.com. Let op! Dit zijn shareware pakketten. Je kunt er natuurlijk ook voor kiezen om een cursor te downloaden van het internet (zoekwoorden voor Google zijn bv: gratis cursors, muisaanwijzers, free cursors, mouse pointers).

We zullen de volgende cursor (rode_cursor.cur) gaan gebruiken voor dit artikel:

Deze kun je dus op je site implementeren door een simpel stukje CSS (Cascading Style Sheets) toe te voegen aan je site. Let op! Dit wordt alleen ondersteund vanaf Netscape 6.0 en Internet Explorer 4.0. Stel je wilt deze cursor voor een bepaalde pagina van je site gebruiken. Je uploadt dan eerst de cursor met behulp van een FTP-programma naar jouw webruimte. Vervolgens plaats je de volgende code tussen je tags op de desbetreffende pagina:

 <style type="text/css">
   body {cursor: url(/framework/data/magazine/nummers/53/rode_cursor.cur);}
</style>

Met url geef je dus de lokatie van jouw cursor in je webruimte aan, zoals hierboven aangegeven staat de cursor in de root van jouw webruimte. Zou je bijvoorbeeld de cursor in een map "cursors" hebben geplaatst, dan ziet de code er als volgt uit:

<style type="text/css">
  body {cursor: url(/framework/data/magazine/nummers/53/cursors/rode_cursor.cur);}

Deze muisaanwijzer is nu zichtbaar op de gehele pagina. Wanneer je nu over een link beweegt, dan verschijnt natuurlijk de standaard muisaanwijzer weer. Ook hier hebben we een simpele oplossing voor. Je voegt dan gewoon de volgende code toe tussen de tags: 

a:hover {cursor: url(/framework/data/magazine/nummers/53/cursors/een_andere_cursor.cur);}

Het resultaat is nu:

 <style type="text/css">
    body {cursor: url(/framework/data/magazine/nummers/53/cursors/bewegende_cursor.ani);}
    a:hover {cursor: url(/framework/data/magazine/nummers/53/cursors/een_andere_cursor.cur);}
</style>

 Probeer het maar eens uit!