Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 402
  • Last Modified:

Javascript to make image move along a circular path

I have the following web page that was given to me and on it there is an image that is to be rotating in a circular path.  When I display the page, I see the motion, but it looks as if it cannot find the image (has the red X).  I have looked at the code, but can't figure out where it is calling the image.  I thought maybe the image just had the wrong name or location.  Any suggestions?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<TITLE> home  </TITLE>
      <META NAME="Keywords" CONTENT="Digital Camera,Photo Album,Image Editing,Web Easy,Scanner,VCOM, Web Easy">
      <META NAME="Description" CONTENT="This Page has been generated by VCOM Technology...">
      <META HTTP-EQUIV="Page-Enter" CONTENT="RevealTrans(Duration=2,Transition=1)">
      <SCRIPT LANGUAGE="JavaScript"><!--//
            IE=(navigator.appName.indexOf('Microsoft') >= 0);
            NS=(navigator.appName.indexOf('Netscape') >= 0);
            V4=(parseInt(navigator.appVersion) >= 4);
            V5=(parseInt(navigator.appVersion)>=5||navigator.appVersion.indexOf("MSIE 5")!=-1);
            MAC=(navigator.userAgent.indexOf('Mac')!=-1); //-->
      </SCRIPT>
      <SCRIPT LANGUAGE="JavaScript1.2"><!--//
            IDP={}; IDP[0]=0;
            isOvr=0; function OnOver(snd,txc,txv,img,imv,ref,flag){} //-->
      </SCRIPT>
      <STYLE TYPE="text/css"><!--
            DIV             {
      position:absolute;
      font-family:sans-serif;
      font-size:10pt;
      left: 552px;
      top: 430px;
      width: 137px;
      height: 100px;
}
            .F03            {font-family:'Comic Sans MS',cursive;font-size:16pt;font-weight:bold;font-style:italic;}
            .F06            {font-family:'Freefrm710 BT';font-size:50pt;font-weight:bold;font-style:italic;}
            .F04            {font-family:'Comic Sans MS',cursive;font-size:7pt;font-weight:bold;font-style:italic;}
            .F01            {font-family:'Comic Sans MS',cursive;font-size:12pt;}
            .F05            {font-family:'Comic Sans MS',cursive;font-size:8pt;font-weight:bold;font-style:italic;}
            .F02            {font-family:'Comic Sans MS',cursive;font-size:12pt;font-weight:bold;font-style:italic;}
            #A17             {color:#ffffff;text-decoration:none;}
            #A16             {color:#ffffff;text-decoration:none;}
            #A13             {color:#ffff00;text-decoration:none;}
            #A10             {color:#ffffff;text-decoration:none;}
            #A9             {color:#ffffff;text-decoration:none;}
            #A8             {color:#ffffff;text-decoration:none;} -->
      </STYLE>
</HEAD>


<BODY BGCOLOR="#ffffff" TEXT="#000000" LINK="#ffff00" VLINK="#800080" ALINK="#FF0000" onLoad="if(V4) OnLoad()">

      
<DIV STYLE="left:2;top:0;width:768;height:600;"> <img src=".\images\shepards2001005.jpg" alt="" align=TOP border=0 vspace=0 hspace=0></DIV>
      <DIV STYLE="left:307;top:73;width:79;height:78;">
            <A HREF="#news" TARGET=_self>
            <IMG SRC=".\images\green_button.gif" ALT="" ALIGN=TOP BORDER=0 VSPACE=0 HSPACE=0>
            </A>
      </DIV>
      <DIV STYLE="left:405;top:125;width:79;height:78;">
            <IMG SRC=".\images\green_button.gif" ALT="" ALIGN=TOP BORDER=0 VSPACE=0 HSPACE=0>
      </DIV>
      <DIV STYLE="left:501;top:181;width:79;height:78;">
            <A HREF="#links" TARGET=_self>
            <IMG SRC=".\images\green_button.gif" ALT="" ALIGN=TOP BORDER=0 VSPACE=0 HSPACE=0>
            </A>
      </DIV>
      <DIV ID=E17 CLASS=F01 STYLE="left:415;top:152;width:64;height:21;text-align:center;">
            <A ID=A17 HREF="shepards2_003.htm" OnMouseOver="if(V4) OnOver(0,IDP[1],0,0,0,'shepards2_003.htm',1)" OnMouseOut="if(V4) OnOver(0,IDP[1],'#ffffff',0,0,0,0)" TARGET=_self>
            History
            </A>
      </DIV>
      <DIV ID=E16 CLASS=F01 STYLE="left:319;top:99;width:56;height:21;text-align:center;">
            <A ID=A16 HREF="shepards2_002.htm" OnMouseOver="if(V4) OnOver(0,IDP[2],0,0,0,'shepards2_002.htm',1)" OnMouseOut="if(V4) OnOver(0,IDP[2],'#ffffff',0,0,0,0)" TARGET=_self>
            Mission
            </A>
      </DIV>
      <DIV STYLE="left:596;top:243;width:79;height:78;">
            <A HREF="shepards2_006.htm" TARGET=_self>
            <IMG SRC=".\images\green_button.gif" ALT="" ALIGN=TOP BORDER=0 VSPACE=0 HSPACE=0>
            </A>
      </DIV>
      <DIV STYLE="left:209;top:21;width:81;height:80;">
            <A HREF="#products" TARGET=_self>
            <IMG SRC=".\images\green_button.gif" ALT="" ALIGN=TOP BORDER=0 VSPACE=0 HSPACE=0>
            </A>
      </DIV>
      <DIV ID=E13 CLASS=F02 STYLE="left:227;top:46;width:46;height:27;">
            <A ID=A13 HREF="shepards2_002.htm" OnMouseOver="if(V4) OnOver(0,IDP[3],0,0,0,'shepards2_002.htm',1)" OnMouseOut="if(V4) OnOver(0,IDP[3],'#ffff00',0,0,0,0)" TARGET=_self>
            Home
            </A>
      </DIV>
      <DIV ID=E12 STYLE="left:538;top:-32334;width:114;height:87;">
            <IMG SRC=".\images\shepards2001004.gif" ALT="" ALIGN=TOP BORDER=0 VSPACE=0 HSPACE=0>
      </DIV>
      <DIV STYLE="left:684;top:303;width:79;height:78;">
            <A HREF="shepards2_006.htm" TARGET=_self>
            <IMG SRC=".\images\green_button.gif" ALT="" ALIGN=TOP BORDER=0 VSPACE=0 HSPACE=0>
            </A>
      </DIV>
      <DIV ID=E10 CLASS=F01 STYLE="left:597;top:266;width:80;height:28;">
            <A ID=A10 HREF="shepards2_005.htm" OnMouseOver="if(V4) OnOver(0,IDP[6],0,0,0,'shepards2_005.htm',1)" OnMouseOut="if(V4) OnOver(0,IDP[6],'#ffffff',0,0,0,0)" TARGET=_self>
            Equipment
            </A>
      </DIV>
      
<DIV ID=E9 CLASS=F01 STYLE="left:519px;top:196px;width:64px;height:48px;">
  <p><A ID=A9 HREF="shepards2_004.htm" OnMouseOver="if(V4) OnOver(0,IDP[7],0,0,0,'shepards2_004.htm',1)" OnMouseOut="if(V4) OnOver(0,IDP[7],'#ffffff',0,0,0,0)" TARGET=_self>
    Sample<BR>
    Parts</A></p>
  <p>&nbsp;</p>
</DIV>
      
      <DIV ID=E8 CLASS=F01 STYLE="left:694;top:328;width:61;height:30;">
            <A ID=A8 HREF="shepards2_006.htm" OnMouseOver="if(V4) OnOver(0,IDP[8],0,0,0,'shepards2_006.htm',1)" OnMouseOut="if(V4) OnOver(0,IDP[8],'#ffffff',0,0,0,0)" TARGET=_self>
            Contact
            </A>
      </DIV>
      
<DIV ID=E7 STYLE="left:534;top:31;width:173;height:132;"> <IMG SRC=".\images\logo.jpg" ALT="" width="173" height="133" HSPACE=0 VSPACE=0 BORDER=0 ALIGN=TOP>
</DIV>
      <DIV CLASS=F03 STYLE="left:257;top:548;width:123;height:30;">
            EST. 1980
      </DIV>
      
<DIV STYLE="left:6px;top:81px;width:122;height:168;"> <A HREF=".\images\billmarion_big.jpg" TARGET=_parent>
  <img src=".\images\billmarion.jpg" alt="" width="158" height="218" hspace=0 vspace=0 border=0 align=TOP>
  </A> </DIV>
      
<DIV CLASS=F04 STYLE="left:22px;top:269px;width:121;height:29;"> Founders <BR>
            William & Marian Shepard
      </DIV>
      <DIV CLASS=F05 STYLE="left:144;top:577;width:369;height:17;">
            7052 SOUTH EAGLE VALLEY ROAD  PORT MATILDA, PA 16870
      </DIV>
      
<DIV STYLE="left:11px;top:522px;width:62;height:47;">
  <SCRIPT LANGUAGE="JavaScript"><!--
            
            // To display different text in place of month and day names (eg: full month names
            // or text in a language other than English), change the two lines below.
            
            var ixMonths=new Array('Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec');
            var ixDays=new Array('Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday');
            
            
            var dd = new Date();
            var nn = dd.getDate();
            var mm = ixMonths[dd.getMonth()];
            var yy = dd.getYear(); if(yy<2000) yy+=1900;
            if(V4)
            {      document.writeln('<table border=\'1\' cellpadding=\'1\' cellspacing=\'0\'><tr><td bgcolor=\'#000000\'>');
                  document.writeln('<table border=\'1\' cellpadding=\'0\' cellspacing=\'1\'>');
                  document.write('<tr><td align=\'center\' bgcolor=\'#f3f3f3\'>');
            } else document.writeln('<center>');
            document.write('<font face=\'arial, helvetica, sans-serif\'>&nbsp;&nbsp;&nbsp;&nbsp;'+mm+'&nbsp;'+yy+'&nbsp;&nbsp;&nbsp;&nbsp;');
            if(V4)
            {      document.writeln('</font></td></tr>');
                  document.write('<tr><td align=\'center\' bgcolor=\'#ffffff\'>');
            } else document.writeln('<br>');
            document.write('<font face=\'arial, helvetica, sans-serif\' size=\'7\'');
            if(dd.getDay() == 0) document.write(' color=\'#ff0000\'');
            document.write('>'+nn+'</font>');
            if(V4)
            {      document.writeln('</td></tr>');
                  document.write('<tr><td align=\'center\' bgcolor=\'#f3f3f3\'><font face=\'arial, helvetica, sans-serif\'>');
            } else document.writeln('<br>');
            document.write('&nbsp;&nbsp;&nbsp;&nbsp;'+ixDays[dd.getDay()]+'&nbsp;&nbsp;&nbsp;&nbsp;</font>');
            if(V4)
            {      document.writeln('</td></tr>');
                  document.writeln('</table>');
                  document.writeln('</td></tr></table>');
            } else document.writeln('</center>');
            //--></SCRIPT>
      </p></DIV>
      
<DIV ID=E2 CLASS=F06 STYLE="left:1px;top:310px;width:674px;height:96px;"> Shepard's Machine</DIV>
      
<DIV ID=E1 CLASS=F06 STYLE="left:157px;top:411px;width:329px;height:96px;">Shop Inc.</DIV>

</BODY>

<SCRIPT LANGUAGE="JavaScript1.2"><!--//
IDP.bw=(IE)?document.body.clientWidth:self.innerWidth;
IDP.bd=(IE)?document.body.clientHeight:self.innerHeight;
IDP.my=(window.parent.frames.length && parent.MyFrm)?parent.MyFrm:window;
IDP[1]=(V5)?'document.getElementById(\'A17\').style.color':(IE)?'A17.style.color':'document.E17.document.linkColor';
IDP[2]=(V5)?'document.getElementById(\'A16\').style.color':(IE)?'A16.style.color':'document.E16.document.linkColor';
IDP[3]=(V5)?'document.getElementById(\'A13\').style.color':(IE)?'A13.style.color':'document.E13.document.linkColor';
IDP[4]={      x:561      ,y:450      ,a:37      ,b:24      ,s:0.0757      ,e:10.2753 };
IDP[5]=(V5)?document.getElementById('E12').style:(IE)?E12.style:document.E12;
IDP[6]=(V5)?'document.getElementById(\'A10\').style.color':(IE)?'A10.style.color':'document.E10.document.linkColor';
IDP[7]=(V5)?'document.getElementById(\'A9\').style.color':(IE)?'A9.style.color':'document.E9.document.linkColor';
IDP[8]=(V5)?'document.getElementById(\'A8\').style.color':(IE)?'A8.style.color':'document.E8.document.linkColor';

function DoCycle(obj,tpt,deg,loop,delay)
{
      if(deg > IDP[tpt].e)
      {      if(!loop) loop=2;
            deg=IDP[tpt].e-2*Math.PI;
      }
      IDP[obj].left= IDP[tpt].x+IDP[tpt].a*Math.cos(deg);
      IDP[obj].top = IDP[tpt].y+IDP[tpt].b*Math.sin(deg);
      if(loop == 2) return;
      deg+=IDP[tpt].s;
      window.setTimeout('DoCycle('+obj+','+tpt+','+deg+','+loop+','+delay+')',delay);
      return;
}
function OnOver(snd,txc,txv,img,imv,ref,flag)
{      if(!isOvr) return;
      if(!V4) return;
      if(typeof(IDP.my.location.href)!='string') return;
      if(img && imv)
      {      if(flag)
            {      if(ref)
                  {      imv.pos=1;
                        if(IDP.my.location.href.lastIndexOf(ref) >= 0) imv.pos=imv.max;
                        --imv.pos;
                  }
                  if(++imv.pos > imv.max) imv.pos=(imv.max)?1:0;
                  eval(img+'="'+imv[imv.pos].src+'"');
            }else
            {      eval( img+'="'+imv[0].src+'"' );
            }
      }
      if(txc)
      {      if(flag)
            {      if(!txv) txv=document.linkColor;
                  if(ref && (IDP.my.location.href.lastIndexOf(ref) >= 0)) txv=document.vlinkColor;
            }else
            if(!txv) txv=document.alinkColor;
            eval(txc+'="'+txv+'"');
      }
}
function DoAlpha(obj,val,max,step,sunk,rise,hold,fall,loop)
{      var tm;
      if(val >= max)
      {      eval(obj+'='+max);
            if(fall < 0) return;
            tm=(sunk)?loop:hold;
            if(tm < 0) return;
            val=max;
            step=-step;
      }else
      if(val <= 0)
      {      eval(obj+'=0');
            if(rise < 0) return;
            tm=(sunk)?hold:loop;
            if(tm < 0) return;
            val=0;
            step=-step;
      }else
      {      tm=(step > 0)?rise:fall;
            if(tm <= 0 ) val=(step > 0)?max:0;
            eval(obj+'='+val);
      }
      window.setTimeout('DoAlpha("'+obj+'",'+(val+step)+','+max+','+step+','+sunk+','+rise+','+hold+','+fall+','+loop+')',tm);
}
function OnLoad()
{
      isOvr=1;
      window.setTimeout('DoCycle(5,4,3.9921,1,60)',0);
      if(IE) E7.style.filter='glow(color=#ffffff,strength=0)';
      if(IE) window.setTimeout('DoAlpha("E7.filters.glow.strength",1,16,1,0,125,2000,125,2000)',0);
      if(IE) E2.style.filter=' shadow(color=#008000,direction=134)';
      if(IE) E1.style.filter=' shadow(color=#008000,direction=134)';
}
//--></SCRIPT>

</HTML>

0
SherryG
Asked:
SherryG
  • 4
1 Solution
 
riyasjefCommented:
hi

change the path of the image in the "div" with id "E12"

<DIV ID=E12 STYLE="left:538;top:-32334;width:114;height:87;">
  <IMG SRC=".\images\shepards2001004.gif" ALT="" ALIGN=TOP BORDER=0 VSPACE=0 HSPACE=0>
</DIV>
0
 
riyasjefCommented:
Actually "div" as a whole is rotating..So image  path may not be ok
0
 
riyasjefCommented:
function OnLoad()
{
     isOvr=1;
     window.setTimeout('DoCycle(5,4,3.9921,1,60)',0);            // FUNCTION CALL HERE
     if(IE) E7.style.filter='glow(color=#ffffff,strength=0)';
     if(IE) window.setTimeout('DoAlpha("E7.filters.glow.strength",1,16,1,0,125,2000,125,2000)',0);
     if(IE) E2.style.filter=' shadow(color=#008000,direction=134)';
     if(IE) E1.style.filter=' shadow(color=#008000,direction=134)';
}

and corr: "div" reference is here

IDP[5]=(V5)?document.getElementById('E12').style:(IE)?E12.style:document.E12;

0
 
SherryGAuthor Commented:
Thanks...I did have the wrong image name in the path.  Once I changed it, all was fine.
0
 
riyasjefCommented:
welcome
0

Featured Post

Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

  • 4
Tackle projects and never again get stuck behind a technical roadblock.
Join Now