Dreevoo.com | Online Learning and Knowledge Sharing
 
Home | Programs | Adobe Dreamweaver | Settings | How to change the mouse pointer on a website
Guest
Click to view your profile
Topics
Programs
Languages
Recipes
Home
Shortcuts
 
 

How to change the mouse pointer on a website

A simple Dreamweaver HTML tutorial where we change the shape of a mouse pointer/cursor on a link or image rollover on a website using a CSS style property.

 
  Author: NikMan | Version: CS5 | 2nd January 2013 |  
 
 
1.
 

Open Adobe Dreamweaver and create a new HTML document.

Or open an existing one.

 
 
2.
 

Click the Add image icon ...

 
 
3.
 

Choose a picture of your choice and click OK.

 
 
4.
 

An image has been added to a website. Leave the image selected or select it if this isn't the case.

 
 
5.
 

Click Code, to enable the Code view.

 
 
6.
 

Notice the HTML code for the image you just added.

Click to position yourself just before the /> symbols (see picture) ...

 
 
7.
 

... and add the following code.

style="cursor:crosshair"

 
 
8.
 

Save the html document and press F12, to open the website in your browser.

Now rollover your mouse over the image and you should notice that the mouse pointer has changed its shape.

Click Comment for more available mouse cursor shapes.

 
 
 
   
  Please login to post a comment
  Click to open user profile  
TheDude, 2nd Jan 2013, 8:22 AM
Some of the mouse cursor styles you can use as well:



TD

 
   
 
 
online learning made for people
Dreevoo.com | CONTRIBUTE | FORUM | INFO