Warning: include(/home/.lurky/jenni/star-girl.org/skins/cookiecheck.php) [function.include]: failed to open stream: No such file or directory in /home/jenni/star-girl.org/pages/tutorials/csscgi/customcursors.php on line 1

Warning: include() [function.include]: Failed opening '/home/.lurky/jenni/star-girl.org/skins/cookiecheck.php' for inclusion (include_path='.:/usr/local/lib/php:/usr/local/php5/lib/pear') in /home/jenni/star-girl.org/pages/tutorials/csscgi/customcursors.php on line 1

Warning: include() [function.include]: Filename cannot be empty in /home/jenni/star-girl.org/pages/tutorials/csscgi/customcursors.php on line 2

Warning: include() [function.include]: Failed opening '' for inclusion (include_path='.:/usr/local/lib/php:/usr/local/php5/lib/pear') in /home/jenni/star-girl.org/pages/tutorials/csscgi/customcursors.php on line 2
Custom Cursors

Ever wanted to make your own cursor to match the layout on your site? Now you can! Note: This tutorial is for PC users only, and custom cursors may not work in all browsers. If you can see the cursors when you hover over the boxes on this page, then you will be able to view custom cursors in your browser.

1. Download the IconArt program from here. The program is completely free, takes up hardly any space, and takes only a couple of minutes to download and install on a dial up connection. :)
2. Once you've opened up the program, note that the button at the top with a number of squares should be set to 32 x 32 at all times. If you change the size, then your cursor will automatically be resized to fit, and it will look quite messy.
3. Now on the grid, draw your cursor. If you're finding it difficult, open up another graphics program (e.g. Paint Shop Pro), and create a new 32 x 32 image. Draw your cursor on that, then copy it, and on IconArt click 'Import from Clipboard', then 'Ok'.
4. Once you have your cursor the way you like it, click the icon at the top with a white arrow and a floppy disk. Click 'Save as...' and name your cursor. Here's an annotated image to show you everything visually:



5. Upload your cursor to your site (note: some free servers don't allow .cur files to be uploaded, so you may need to find somewhere else to host your cursors), and then copy and paste this code after the HEAD tag on your page:

<style> <!-- BODY{ cursor:url("YOURIMAGE.cur"); } --> </style>

6. Where it says YOURIMAGE.cur, change that to whatever you named your cursor (mine's heart.cur). Save and you're done :)

Note: You only need to put the beginning and end parts of your CSS code once on a page. So if you use more than one bit of code on your page it will look like this: <style type="text/css"> Code Code Code </style>
Warning: include() [function.include]: Filename cannot be empty in /home/jenni/star-girl.org/pages/tutorials/csscgi/customcursors.php on line 30

Warning: include() [function.include]: Failed opening '' for inclusion (include_path='.:/usr/local/lib/php:/usr/local/php5/lib/pear') in /home/jenni/star-girl.org/pages/tutorials/csscgi/customcursors.php on line 30