Follow The Cursor

metadata
  • keywords:
    • software
    • javascript
    • css
  • published:

Here I am testing to see if a box can follow a cursor around the screen using JavaScript and CSS. Give it a try and see what happens. Below, I go through the source code for you and my usability findings.

Some random text.

Below is the source code for the JavaScript file, it features the mouse coordinate functions. It may be more complicated than other examples which can be found on the internet but you'll see that this script does not use browser profiling and it also switches the position of the box if it thinks that some of the box will be outside the browser's window.

Below is the source code for the CSS file, it features the style to make the box look pretty.

Doing my own tests I have found that:

Browser Box follows cursor?
Firefox 3 Yes
IE7 Yes
IE8 Beta 2 Yes
Konqueror 3.5 Yes
Opera 9.5 Yes
Safari 3.1 Yes