Results 1 to 3 of 3

Thread: mouse trailer doesnot appear in firefox

  1. #1
    Join Date
    Dec 2007
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question mouse trailer doesnot appear in firefox

    Hi All,

    I have been using this javascipt


    <LAYER NAME="a0" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#ffffff" CLIP="0,0,1,1"></LAYER>
    <LAYER NAME="a1" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#fff000" CLIP="0,0,1,1"></LAYER>
    <LAYER NAME="a2" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#ffa000" CLIP="0,0,1,1"></LAYER>
    <LAYER NAME="a3" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#ff00ff" CLIP="0,0,1,1"></LAYER>
    <LAYER NAME="a4" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#00ff00" CLIP="0,0,1,1"></LAYER>
    <LAYER NAME="a5" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#FF00FF" CLIP="0,0,1,1"></LAYER>
    <LAYER NAME="a6" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#FF0000" CLIP="0,0,1,1"></LAYER>
    <LAYER NAME="a7" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#ffffff" CLIP="0,0,2,2"></LAYER>
    <LAYER NAME="a8" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#fff000" CLIP="0,0,2,2"></LAYER>
    <LAYER NAME="a9" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#ffa000" CLIP="0,0,2,2"></LAYER>
    <LAYER NAME="a10" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#ff00ff" CLIP="0,0,2,2"></LAYER>
    <LAYER NAME="a11" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#00ff00" CLIP="0,0,2,2"></LAYER>
    <LAYER NAME="a12" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#0000ff" CLIP="0,0,2,2"></LAYER>
    <LAYER NAME="a13" LEFT=10 TOP=10 VISIBILITY=SHOW BGCOLOR="#FF0000" CLIP="0,0,3,3"></LAYER>


    <script language="JavaScript">

    /*
    Magic Wand cursor (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
    */

    if (document.all){
    with (document){
    write('<div id="starsDiv" style="position:absolute;top:0px;left:0px">')
    write('<div style="position:relative;width:1px;height:1px;background:#ffffff;font-size:1px;visibility:visible"></div>')
    write('<div style="position:relative;width:1px;height:1px;background:#fff000;font-size:1px;visibility:visible"></div>')
    write('<div style="position:relative;width:1px;height:1px;background:#ffa000;font-size:1px;visibility:visible"></div>')
    write('<div style="position:relative;width:1px;height:1px;background:#ff00ff;font-size:1px;visibility:visible"></div>')
    write('<div style="position:relative;width:1px;height:1px;background:#00ff00;font-size:1px;visibility:visible"></div>')
    write('<div style="position:relative;width:1px;height:1px;background:#0000ff;font-size:1px;visibility:visible"></div>')
    write('<div style="position:relative;width:1px;height:1px;background:#FF0000;font-size:1px;visibility:visible"></div>')
    write('<div style="position:relative;width:2px;height:2px;background:#ffffff;font-size:2px;visibility:visible"></div>')
    write('<div style="position:relative;width:2px;height:2px;background:#fff000;font-size:2px;visibility:visible"></div>')
    write('<div style="position:relative;width:2px;height:2px;background:#ffa000;font-size:2px;visibility:visible"></div>')
    write('<div style="position:relative;width:2px;height:2px;background:#ff00ff;font-size:2px;visibility:visible"></div>')
    write('<div style="position:relative;width:2px;height:2px;background:#00ff00;font-size:2px;visibility:visible"></div>')
    write('<div style="position:relative;width:2px;height:2px;background:#0000ff;font-size:2px;visibility:visible"></div>')
    write('<div style="position:relative;width:3px;height:3px;background:#FF0000;font-size:3px;visibility:visible"></div>')
    write('</div>')
    }
    }


    var Clrs=new Array(6)
    Clrs[0]='ff0000';
    Clrs[1]='00ff00';
    Clrs[2]='000aff';
    Clrs[3]='ff00ff';
    Clrs[4]='fff000';
    Clrs[5]='fffff0';



    if (document.layers)
    {window.captureEvents(Event.MOUSEMOVE);}
    var yBase = 200;
    var xBase = 200;
    var step;
    var currStep = 0;
    var Xpos = 1;
    var Ypos = 1;

    if (document.all)
    {
    function MoveHandler(){
    Xpos = document.body.scrollLeft+event.x;
    Ypos = document.body.scrollTop+event.y;
    }
    document.onmousemove = MoveHandler;
    }

    else if (document.layers)
    {
    function xMoveHandler(evnt){
    Xpos = evnt.pageX;
    Ypos = evnt.pageY;
    }
    window.onMouseMove = xMoveHandler;
    }

    function animateLogo() {
    if (document.all)
    {
    yBase = window.document.body.offsetHeight/4;
    xBase = window.document.body.offsetWidth/4;
    }
    else if (document.layers)
    {
    yBase = window.innerHeight/4;
    xBase = window.innerWidth/4;
    }

    if (document.all)
    {
    for ( i = 0 ; i < starsDiv.all.length ; i++ )
    {step=3;
    starsDiv.all[i].style.top = Ypos + yBase*Math.cos((currStep + i*4)/12)*Math.cos(0.7+currStep/200);
    starsDiv.all[i].style.left = Xpos + xBase*Math.sin((currStep + i*3)/10)*Math.sin(8.2+currStep/400);
    for (ai=0; ai < Clrs.length; ai++)
    {
    var c=Math.round(Math.random()*[ai]);
    }
    starsDiv.all[i].style.background=Clrs[c];
    }
    }

    else if (document.layers)
    {
    for ( j = 0 ; j < 14 ; j++ ) //number of NS layers!
    {step = 4;
    var templayer="a"+j
    document.layers[templayer].top = Ypos + yBase*Math.sin((currStep + j*4)/12)*Math.cos(0.7+currStep/200);
    document.layers[templayer].left = Xpos + xBase*Math.sin((currStep + j*3)/10)*Math.sin(8.2+currStep/400);
    for (aj=0; aj < Clrs.length; aj++)
    {
    var c=Math.round(Math.random()*[aj]);
    }
    document.layers[templayer].bgColor=Clrs[c];
    }
    }
    currStep+= step;
    setTimeout("animateLogo()", 10);
    }
    animateLogo();
    // -->
    </script>


    in the body section of the html page, it displays in IE but not in FF, how to go about it. If some could help with this .


    Thanks,
    Ramya

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Warning: Please include a link to the DD script in question in your post. See this thread for the proper posting format when asking a question.


    That script is not rated for FF. It would need to have branching added to use the document.getElementById method in addition to the document.all and document.layers methods it currently can use as available in the browser. Pixels would need to be specified as units in some places as well, there could be other issues.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Try this:

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
    <html>
    <head>
    <title>Magic Wand - Update</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <style type="text/css">
    body {
    color:#fff;
    background-color:#000;
    }
    </style>
    </head>
    <body>
    
    <script type="text/javascript">
    
    /*
    Magic Wand cursor (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
      *** This notice must remain for legal use ***
    Updated in Dynamic Drive Forums Dec 2007 by jscheuer1, remove early Netscape, add FF support
    */
    
    if (document.all||document.getElementById){
    with (document){
    write('<div id="starsDiv" style="position:absolute;top:0px;left:0px">')
    write('<div style="position:relative;width:1px;height:1px;background:#ffffff;font-size:1px;visibility:visible"></div>')
    write('<div style="position:relative;width:1px;height:1px;background:#fff000;font-size:1px;visibility:visible"></div>')
    write('<div style="position:relative;width:1px;height:1px;background:#ffa000;font-size:1px;visibility:visible"></div>')
    write('<div style="position:relative;width:1px;height:1px;background:#ff00ff;font-size:1px;visibility:visible"></div>')
    write('<div style="position:relative;width:1px;height:1px;background:#00ff00;font-size:1px;visibility:visible"></div>')
    write('<div style="position:relative;width:1px;height:1px;background:#0000ff;font-size:1px;visibility:visible"></div>')
    write('<div style="position:relative;width:1px;height:1px;background:#FF0000;font-size:1px;visibility:visible"></div>')
    write('<div style="position:relative;width:2px;height:2px;background:#ffffff;font-size:2px;visibility:visible"></div>')
    write('<div style="position:relative;width:2px;height:2px;background:#fff000;font-size:2px;visibility:visible"></div>')
    write('<div style="position:relative;width:2px;height:2px;background:#ffa000;font-size:2px;visibility:visible"></div>')
    write('<div style="position:relative;width:2px;height:2px;background:#ff00ff;font-size:2px;visibility:visible"></div>')
    write('<div style="position:relative;width:2px;height:2px;background:#00ff00;font-size:2px;visibility:visible"></div>')
    write('<div style="position:relative;width:2px;height:2px;background:#0000ff;font-size:2px;visibility:visible"></div>')
    write('<div style="position:relative;width:3px;height:3px;background:#FF0000;font-size:3px;visibility:visible"></div>')
    write('</div>')
    }
    }
    
    var Clrs=new Array(6)
    Clrs[0]='ff0000';
    Clrs[1]='00ff00';
    Clrs[2]='000aff';
    Clrs[3]='ff00ff';
    Clrs[4]='fff000';
    Clrs[5]='fffff0';
    
    var yBase = 200;
    var xBase = 200;
    var step;
    var currStep = 0;
    var Xpos = 1;
    var Ypos = 1;
    
    if (typeof window.event!='undefined')
    {
    function iecompattest(){
    return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body;
    }
      function MoveHandler(){
      Xpos = iecompattest().scrollLeft+event.x;
      Ypos = iecompattest().scrollTop+event.y;
      }
      document.onmousemove = MoveHandler;
    }
    
    else if (document.getElementById)
    {
      function xMoveHandler(evnt){
      Xpos = evnt.pageX;
      Ypos = evnt.pageY;
      }
      document.onmousemove = xMoveHandler;
    }
    
    function animateLogo() {
    if (window.innerWidth&&document.getElementById)
    {
     yBase = window.innerHeight/4;
     xBase = window.innerWidth/4;
     for ( var d=document.getElementById('starsDiv').getElementsByTagName('div'), i = 0 ; i < d.length ; i++ )
     {step=3;
      d[i].style.top = Ypos + yBase*Math.cos((currStep + i*4)/12)*Math.cos(0.7+currStep/200)+'px';
      d[i].style.left = Xpos + xBase*Math.sin((currStep + i*3)/10)*Math.sin(8.2+currStep/400)+'px';
      for (var ai=0; ai < Clrs.length; ai++)
        {
         var c=Math.round(Math.random()*[ai]);
        }
        d[i].style.backgroundColor='#'+Clrs[c];
     }
    }
    else if (document.all)
    {
     yBase = window.iecompattest().offsetHeight/4;
     xBase = window.iecompattest().offsetWidth/4;
     for ( var i = 0 ; i < starsDiv.all.length ; i++ )
     {step=3;
      starsDiv.all[i].style.top = Ypos + yBase*Math.cos((currStep + i*4)/12)*Math.cos(0.7+currStep/200);
      starsDiv.all[i].style.left = Xpos + xBase*Math.sin((currStep + i*3)/10)*Math.sin(8.2+currStep/400);
      for (var ai=0; ai < Clrs.length; ai++)
        {
         var c=Math.round(Math.random()*[ai]);
        }
        starsDiv.all[i].style.background=Clrs[c];
     }
    }
    currStep+= step;
    setTimeout("animateLogo()", 10);
    }
    if(document.all||document.getElementById)
    animateLogo();
    </script>
    </body>
    </html>
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •