Want to get involved in developing SMF, then why not lend a hand on our github!

Main Menu

Changing (Messing) the mouse-pointer on your site.

Started by kat, October 05, 2013, 04:29:31 PM

Previous topic - Next topic


<script language="JavaScript1.2">

var trailLength = 8 // The length of trail (8 by default; A higher value will create a longer tail)
var path = "cursor.gif" // the URL of your image.

var standardbody=(document.compatMode=="CSS1Compat")? document.documentElement : document.body //create reference to common "body" across doctypes
var i,d = 0

function initTrail() { // prepare the script
images = new Array() // prepare the image array
for (i = 0; i < parseInt(trailLength); i++) {
images[i] = new Image()
images[i].src = path
storage = new Array() // prepare the storage for the coordinates
for (i = 0; i < images.length*3; i++) {
storage[i] = 0
for (i = 0; i < images.length; i++) { // make divs for IE and layers for Navigator
document.write('<div id="obj' + i + '" style="position: absolute; z-Index: 100; height: 0; width: 0"><img src="' + images[i].src + '"></div>')
function trail() { // trailing function
for (i = 0; i < images.length; i++) { // for every div/layer
document.getElementById("obj" + i) = storage[d]+'px' // the Y-coordinate
document.getElementById("obj" + i).style.left = + storage[d+1]+'px' // the X-coordinate
d = d+2
for (i = storage.length; i >= 2; i--) { // save the coordinate for the div/layer that's behind
storage[i] = storage[i-2]
d = 0 // reset for future use
var timer = setTimeout("trail()",10) // call recursively
function processEvent(e) { // catches and processes the mousemove event
if (window.event) { // for IE
storage[0] = window.event.y+standardbody.scrollTop+10
storage[1] = window.event.x+standardbody.scrollLeft+10
} else {
storage[0] = e.pageY+12
storage[1] = e.pageX+12

document.onmousemove = processEvent // start capturing


To see it, in action:

I put the code right at the top of my theme's index.template.php file, before the opening <?php tag, and it works a treat!

Use at own risk, &c. ;)


Wow, some old school code there... haven't seen <script> tags written like that in years :o (It's not valid for XHTML, which requires it be written as <script type="text/javascript">)

I wouldn't personally put it at the start of index.template.php because it's loaded in places where things shouldn't be pushed out, but I'm not sure where best to put it otherwise.



Before the beginning of the body tag? No, it should be in the <head> or inside the <body> tag, but if it's going to be anywhere, the end of the body tag would be better IMO.


I couldn't check with a v2.0.5 site, coz I have 2.1 on there, at the moment.

On a v1 site, it's OK, after the opening <body> tag. In 2.1, the opening tag's rather more than the simple <body>'; and it farted, if I put it after what's there, in 2.1.

<body id="', $context['browser_body_id'], '" class="action_', !empty($context['current_action']) ? htmlspecialchars($context['current_action']) : (!empty($context['current_board']) ?

But, as that tag's just <body>'; I would assume that it would be OK, there, in 2.0.x, too.