Tutorials » HTML » Custom CursorsViewing Custom CursorsThere are a bunch of different types of default cursors that you can use on a webpage. Here are the most common ones: DEFAULT TEXT HAND CROSSHAIR HELP WAIT MOVE W-RESIZE NW-RESIZE N-RESIZE NE-RESIZE E-RESIZE SE-RESIZE S-RESIZE SW-RESIZE If you'd like to see what the cursors look like, just hover your mouse over the word above. Using Custom CursorsHow you use the cursor codes really depends on what script you're using. Select the code below that works best for what you want to use the cursor for. Adding to Specific TagIf you only want the cursor to appear when your guest hovers over one specific thing on your webpage, use this code. Example: <div style="cursor: sw-resize;">Adding to BODY TagIf you want the cursor to appear the whole time your guest is on your page, use this code. Example: <BODY style="cursor: move;">Adding to a LinkIf you want the cursor to appear only when your guest hovers over a link, use this code. Example: <a href="home.html" style="cursor: wait;">Home Page</a>Adding to Custom Style Sheet (CSS)If you're using CSS and you'd like to add a cursor effect through your style sheet, use this code. Example: main {cursor: w-resize;} |
