0 Replies - 1258 Views - Last Post: 28 June 2007 - 07:29 PM

#1 no2pencil  Icon User is online

  • Professor Snuggly Pants
  • member icon

Reputation: 6552
  • View blog
  • Posts: 30,682
  • Joined: 10-May 07

Change the Cursor with css

Posted 28 June 2007 - 07:29 PM

Description: Change the mouse cursor using only css
<html><head><title>Change the cursor using css, by #2pencil</title>
<style type="text/css">
p.auto{ cursor:auto; }
p.cross{ cursor:crosshair; }
p.default{ cursor:default; }
p.pointer{ cursor:pointer; }
p.move{ cursor:move; }
p.eresize{ cursor:e-resize; }
p.neresize{ cursor:ne-resize; }
p.nwresize{ cursor:nw-resize; }
p.nresize{ cursor:n-resize; }
p.seresize{ cursor:se-resize; }
p.swresize{ cursor:sw-resize; }
p.sresize{ cursor:s-resize; }
p.wresize{ cursor:w-resize; }
p.text{ cursor:text; }
p.wait{ cursor:wait; }
p.help{ cursor:help; }
</style>
<body>
<p>Move the mouse over the words to see the cursor change:</p>
<p class=auto>Auto</p>
<p class=cross>Crosshair</p>
<p class=default>Default</p>
<p class=pointer>Pointer</p>
<p class=move>Move</p>
<p class=eresize>e-resize</p>
<p class=neresize>ne-resize</p>
<p class=nwresize>nw-resize</p>
<p class=nresize>n-resize</p>
<p class=seresize>se-resize</p>
<p class=swresize>sw-resize</p>
<p class=sresize>s-resize</p>
<p class=wresize>w-resize</p>
<p class=text>text</p>
<p class=wait>wait</p>
<p class=help>help</p>
</body></html>




Is This A Good Question/Topic? 0
  • +

Page 1 of 1