Search this site!

Return to the CSB Support home page
Roaming Cursor   |   Cursor Trail   |   Horizontal Scroll
Roaming Cursor
Description:
Do you see the floating hourglass???

This suggestion comes from a Trellix user (thanks, Hoffman!) who wanted to know how to implement this.  The answer comes by way of Dynamic Drive.  
How to use:
1. First go to the Dynamic Drive page and read the information as they present it about the 'Roaming cursor'

2. Next, I would suggest right away to go to Step 2 of their site, select a cursor image you wish to use, then right click on it, and save it to your PC.

For this example,  just so it's different, I selected the hourglass image, and saved it as 'cursor4.gif'.  Be sure to remember where you stored the image!

3. Flip over to your Trellix file, and click to insert a BYOWG on the page where you want the roaming cursor to appear.

4. Go back to Dynamic Drive, copy the script they give you in Step 1 of their site, then flip back to your Trellix page and click on 'Paste' to insert the code into your PAGE USING iNSERT html/BYOWG

5. There is only one thing to change in their script.  Locate the line that reads:
var cursorpath="cursor.gif"
and modify it so that it look like this:
var cursorpath="^GEMDIR/cursor4.gif"

Remember that I saved my cursor image as 'cursor4.gif' --- if you called yours something different, modify the name of the gif accordingly.

Here's how the BYOWG screen looked when I added it to my page:


6. Click on 'Files for this gem' , and then locate and insert the cursor image file you saved.  Again, in my case, it was 'cursor4.gif'  


7. Click on 'Modify', save and publish your Trellix file and check out the results!

Example:
Download the code
right click on link, then click on 'Save target (or frame) as'

Other information:
For more scripts, go to Dynamic Drive

Source code:
(line to be modified is highlighted)
<SCRIPT language="JavaScript1.2">

/*
Roaming Cursor script (By Kurt at kurt.grigg@virgin.net)
Modified and permission granted to Dynamic Drive to feature script in archive
For full source, usage terms, and 100's more DHTML scripts, visit http://dynamicdrive.com
*/

//specify path to cursor image
var cursorpath="cursor.gif"

if (document.layers)
{document.write("<LAYER NAME='PoInTeRs' LEFT=10 TOP=10><img src='"+cursorpath+"' width=17 height=22></LAYER>")}
else if (document.all){document.write("<div id='pOiNtErS' style='position:absolute;top:10px;left:10px;width:17px;height:22px;z-index:50'><img src='"+cursorpath+"' width=17 height=22></div>")}

count=-1;
move=1;

function Curve(){
abc=new Array(0,1,1,1,2,3,4,0,6,-1,-1,-1,-2,-3,-4,0,-6)
for (i=0; i < abc.length; i++)
{var C=Math.round(Math.random()*[i])}
howbend=abc[C];
setTimeout('Curve()',1900);
return howbend;
}
ypos=10;
xpos=10;

degree = 60;
function MoveRandom(){
PathBend=degree+=howbend;//ok!
y = 4*Math.sin(PathBend*Math.PI/180);
x = 6*Math.cos(PathBend*Math.PI/180);
if (document.layers){
ypos+=y;
xpos+=x;
document.PoInTeRs.top=ypos+window.pageYOffset;
document.PoInTeRs.left=xpos+window.pageXOffset;
}
else if (document.all){
ypos+=y;
xpos+=x;
document.all.pOiNtErS.style.top=ypos+document.body.scrollTop;
document.all.pOiNtErS.style.left=xpos+document.body.scrollLeft;
}
T=setTimeout('MoveRandom()',50);
}
function edges(){
if (document.layers){
if (document.PoInTeRs.left >= window.innerWidth-40+window.pageXOffset)degree=Math.round(Math.random()*45+157.5);
if (document.PoInTeRs.top >= window.innerHeight-30+window.pageYOffset)degree=Math.round(Math.random()*45-112.5);
if (document.PoInTeRs.top <= 2+window.pageYOffset) degree = Math.round(Math.random()*45+67.5);//OK!
if (document.PoInTeRs.left <= 2+window.pageXOffset) degree = Math.round(Math.random()*45-22.5);//OK!
}
else if (document.all)
{
if (document.all.pOiNtErS.style.pixelLeft >= document.body.offsetWidth-45+document.body.scrollLeft)degree=Math.round(Math.random()*45+157.5);
if (document.all.pOiNtErS.style.pixelTop >= document.body.offsetHeight-35+document.body.scrollTop)degree=Math.round(Math.random()*45-112.5);
if (document.all.pOiNtErS.style.pixelTop <= 2+document.body.scrollTop) degree = Math.round(Math.random()*45+67.5);//OK!
if (document.all.pOiNtErS.style.pixelLeft <= 2+document.body.scrollLeft) degree = Math.round(Math.random()*45-22.5);//OK!
}
setTimeout('edges()',100);
}
function starteffect(){
Curve();
MoveRandom();// onUnload="opener.gO()"
edges();
}

if (document.all||document.layers)
window.onload=starteffect
</script>