Cursor trailer script

Hi guys,

I please to help on a cursor script.
You can see in the video below how the script should work.
https://www.youtube.com/watch?v=0YlRNiu2fB0

I’m in trouble with the images. They don’t follow the cursor immediately, see the image below :
pointer

Here is my code :

A=document.getElementById
B=document.all;
C=document.layers;

T1=new Array("sweeties/amour/images/val6.gif",32,22,"sweeties/amour/images/val5.gif",33,24,"sweeties/amour/images/val4.gif",41,40,"sweeties/amour/images/val3.gif",43,29,"sweeties/amour/images/val2.gif",55,40,"sweeties/amour/images/val1.gif",69,60)

var offsetx=0 //x offset of trail from mouse pointer
var offsety=0 //y offset of trail from mouse pointer

nos=parseInt(T1.length/3)
rate=50
ie5fix1=0;
ie5fix2=0;
rightedge=B? document.body.clientWidth-T1[1] : window.innerWidth-T1[1]-20
bottomedge=B? document.body.scrollTop+document.body.clientHeight-T1[2] : window.pageYOffset+window.innerHeight-T1[2]

for (i=0;i<nos;i++) {
    createContainer("CUR"+i,i*10,i*10,i*3+1,i*3+2,"","<img src='"+T1[i*3]+"' width="+T1[(i*3+1)]+" height="+T1[(i*3+2)]+" border=0>")
}

function createContainer(N,Xp,Yp,W,H,At,HT,Op,St) {
    with (document) {
        write((!A && !B) ? "<layer id='"+N+"' left="+Xp+" top="+Yp+" width="+W+" height="+H : "<div id='"+N+"'"+" style='z-index: 8; position:absolute;left:"+Xp+"; top:"+Yp+"; width:"+W+"; height:"+H+"; ");
        if(St) {
            if (C)
                write(" style='");
                write(St+";' ")
        }   
        else write((A || B)?"'":"");
            write((At)? At+">" : ">");
            write((HT) ? HT : "");
    if (!Op)
        closeContainer(N)
    }
}

function closeContainer() {
    document.write((A || B)?"</div>":"</layer>")
}

function getXpos(N) {
    if (A)
        return parseInt(document.getElementById(N).style.left)
    else if (B)
        return parseInt(B[N].style.left)
    else
        return C[N].left
}

function getYpos(N) {
    if (A)
        return parseInt(document.getElementById(N).style.top)
    else if (B)
        return parseInt(B[N].style.top)
    else
        return C[N].top
}

function moveContainer(N,DX,DY) {
    c=(A)? document.getElementById(N).style : (B)? B[N].style : (C)? C[N] : "";
    if (!B) {
        rightedge=window.innerWidth-T1[1]-20
        bottomedge=window.pageYOffset+window.innerHeight-T1[2]
    }
    c.left=Math.min(rightedge, DX+offsetx) + 'px';
    c.top=Math.min(bottomedge, DY+offsety) + 'px';
}

function cycle() {
    //if (IE5) 
    if (document.all&&window.print) {
        ie5fix1=document.body.scrollLeft;
        ie5fix2=document.body.scrollTop;
    }
    for (i=0;i<(nos-1);i++) {
        moveContainer("CUR"+i,getXpos("CUR"+(i+1)),getYpos("CUR"+(i+1)))
    }
}

function newPos(e) {
    moveContainer("CUR"+(nos-1),(B)?event.clientX+ie5fix1:e.pageX+2,(B)?event.clientY+ie5fix2:e.pageY+2)
}

function getedgesIE() {
    rightedge=document.body.clientWidth-T1[1]
    bottomedge=document.body.scrollHeight-T1[2]
}

if (B) {
    window.onload=getedgesIE
    window.onresize=getedgesIE
}

if(document.layers)
    document.captureEvents(Event.MOUSEMOVE)
    document.onmousemove=newPos
setInterval("cycle()",rate)

hello and welcome to fcc forum :slight_smile:

do you have it live in “codepen / repl.it” kind of environment as well? that way it becomes more interactive to troubleshoot

happy coding :slight_smile:

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.