Rabu, 19 November 2025

JAVASCRIPT Trigonometry



JavaScript provides trigonometric functions as part of its built-in Math object. These functions operate on angles expressed in radians, not degrees.

Basic Trigonometric Functions:
  • Math.sin(x)Returns the sine of an angle x (in radians).
  • Math.cos(x)Returns the cosine of an angle x (in radians).
  • Math.tan(x)Returns the tangent of an angle x (in radians).
Inverse Trigonometric Functions:
  • Math.asin(x)
    Returns the arcsine (inverse sine) of x in radians. The value of x must be between -1 and 1.
  • Math.acos(x)
    Returns the arccosine (inverse cosine) of x in radians. The value of x must be between -1 and 1.
  • Math.atan(x)
    Returns the arctangent (inverse tangent) of x in radians.
  • Math.atan2(y, x)
    Returns the arctangent of the quotient of its arguments (y/x) in radians, considering the signs of both y and x to determine the correct quadrant.
Constants:
  • Math.PIRepresents the mathematical constant Pi (approximately 3.14159).
Converting Between Degrees and Radians:
Since JavaScript's trigonometric functions use radians, conversion is often necessary when working with angles in degrees.
  • Degrees to Radiansradians = degrees * (Math.PI / 180)
  • Radians to Degreesdegrees = radians * (180 / Math.PI)
Example Usage:
JavaScript
// Calculate sine of 90 degreesconst angleInDegrees = 90;const angleInRadians = angleInDegrees * (Math.PI / 180);const sineValue = Math.sin(angleInRadians); // Approximately 1// Calculate the angle (in radians) whose cosine is 0.5const cosineValue = 0.5;const angleFromCosine = Math.acos(cosineValue); // Approximately 1.047 radians (60 degrees)// Using Math.atan2 to get the angle from coordinatesconst y = 1;const x = 1;const angleFromCoordinates = Math.atan2(y, x); // Approximately 0.785 radians (45 degrees)
SAMPLE CODE<html> <head> <style> A:link {color:rgb(255,132,72);text-decoration:none} A:hover {color:rgb(255,132,72);text-decoration:underline} A:visited {color:blue;text-decoration:none} </style> </head> <body> <div style="background-image: url('bar-up.gif'); height: 21"> <img src=menu-up.gif width="153" height="21"></div> <br> <br> <div style="height:21"><img src=menu.gif vspace=0 width="140" height="21"></div> <div> <table width=140 border=0 height=27 bgcolor=white style="border:1px solid orange"> <tr> <td valign=top height="37" bgcolor="#FFFFCC" background=bg.gif> <font color="#FF6600" face="Verdana"> <a href="profil.html">Profil</a><BR> <a href=".html">Menu Item 1</a><BR> <a href=".html">Menu Item 2</a><BR> <a href=".html">Menu Item 3</a><BR> <a href=".html">Menu Item 4</a><BR> <a href=".html">Menu Item 5</a><BR> <a href="data.html">Data Base</a> </font> </td> </tr> </table> </div> <BR> <br> <DIV ID = "fly1" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "belajar.html"><IMG SRC="1.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly2" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "komputer.html"><IMG SRC="2.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly3" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="3.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly4" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="4.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly5" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "network.html"><IMG SRC="5.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly6" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "osis.html"><IMG SRC="6.gif" width="70" height="60" border=0 ></A> </DIV> <SCRIPT LANGUAGE = "JavaScript"> var pos;var ra = 100;var rb = 100;var pi = Math.PI;var inc = pi / 180;var isNS = (navigator.appName == "Netscape" && parseInt (navigator.appVersion) >= 4); var fly1 = (isNS) ? document.fly1 : document.all.fly1.style; var fly2 = (isNS) ? document.fly2 : document.all.fly2.style; var fly3 = (isNS) ? document.fly3 : document.all.fly3.style; var fly4 = (isNS) ? document.fly4 : document.all.fly4.style; var fly5 = (isNS) ? document.fly5 : document.all.fly5.style; var fly6 = (isNS) ? document.fly6 : document.all.fly6.style; var objets; objets = new Array(fly1, fly2, fly3, fly4, fly5, fly6);pos = new Array();pos[0] = 0; for (var i = 1; i < objets.length; i++) {pos[i] = parseFloat(pos[i - 1] + ((2 * pi) / objets.length));} function rotateObjets() { for (var i = 0; i < pos.length; i++) {pos[i] += inc;objets[i].left = (ra * Math.sqrt(pos[i])) + 250;objets[i].top = (rb * Math.tan(pos[i])) + 165;objets [i].visibility = "visible";} rotateTimer = window.setTimeout("rotateObjets()", 50); } rotateObjets(); </SCRIPT> </body> </html><html> <head> <style> A:link {color:rgb(255,132,72);text-decoration:none} A:hover {color:rgb(255,132,72);text-decoration:underline} A:visited {color:blue;text-decoration:none} </style> </head> <body> <div style="background-image: url('bar-up.gif'); height: 21"> <img src=menu-up.gif width="153" height="21"></div> <br> <br> <div style="height:21"><img src=menu.gif vspace=0 width="140" height="21"></div> <div> <table width=140 border=0 height=27 bgcolor=white style="border:1px solid orange"> <tr> <td valign=top height="37" bgcolor="#FFFFCC" background=bg.gif> <font color="#FF6600" face="Verdana"> <a href="profil.html">Profil</a><BR> <a href=".html">Menu Item 1</a><BR> <a href=".html">Menu Item 2</a><BR> <a href=".html">Menu Item 3</a><BR> <a href=".html">Menu Item 4</a><BR> <a href=".html">Menu Item 5</a><BR> <a href="data.html">Data Base</a> </font> </td> </tr> </table> </div> <BR> <br> <DIV ID = "fly1" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "belajar.html"><IMG SRC="1.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly2" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "komputer.html"><IMG SRC="2.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly3" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="3.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly4" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="4.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly5" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "network.html"><IMG SRC="5.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly6" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "osis.html"><IMG SRC="6.gif" width="70" height="60" border=0 ></A> </DIV> <SCRIPT LANGUAGE = "JavaScript"> var pos;var ra = 100;var rb = 100;var pi = Math.PI;var inc = pi / 180;var isNS = (navigator.appName == "Netscape" && parseInt (navigator.appVersion) >= 4); var fly1 = (isNS) ? document.fly1 : document.all.fly1.style; var fly2 = (isNS) ? document.fly2 : document.all.fly2.style; var fly3 = (isNS) ? document.fly3 : document.all.fly3.style; var fly4 = (isNS) ? document.fly4 : document.all.fly4.style; var fly5 = (isNS) ? document.fly5 : document.all.fly5.style; var fly6 = (isNS) ? document.fly6 : document.all.fly6.style; var objets; objets = new Array(fly1, fly2, fly3, fly4, fly5, fly6);pos = new Array();pos[0] = 0; for (var i = 1; i < objets.length; i++) {pos[i] = parseFloat(pos[i - 1] + ((2 * pi) / objets.length));} function rotateObjets() { for (var i = 0; i < pos.length; i++) {pos[i] += inc;objets[i].left = (ra * Math.cos(pos[i])) + 250;objets[i].top = (rb * Math.sin(pos[i])) + 165;objets [i].visibility = "visible";} rotateTimer = window.setTimeout("rotateObjets()", 50); } rotateObjets(); </SCRIPT> </body> </html><html> <head> <style> A:link {color:rgb(255,132,72);text-decoration:none} A:hover {color:rgb(255,132,72);text-decoration:underline} A:visited {color:blue;text-decoration:none} </style> </head> <body> <div style="background-image: url('bar-up.gif'); height: 21"> <img src=menu-up.gif width="153" height="21"></div> <br> <br> <div style="height:21"><img src=menu.gif vspace=0 width="140" height="21"></div> <div> <table width=140 border=0 height=27 bgcolor=white style="border:1px solid orange"> <tr> <td valign=top height="37" bgcolor="#FFFFCC" background=bg.gif> <font color="#FF6600" face="Verdana"> <a href="profil.html">Profil</a><BR> <a href=".html">Menu Item 1</a><BR> <a href=".html">Menu Item 2</a><BR> <a href=".html">Menu Item 3</a><BR> <a href=".html">Menu Item 4</a><BR> <a href=".html">Menu Item 5</a><BR> <a href="data.html">Data Base</a> </font> </td> </tr> </table> </div> <BR> <br> <DIV ID = "fly1" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "belajar.html"><IMG SRC="1.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly2" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "komputer.html"><IMG SRC="2.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly3" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="3.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly4" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="4.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly5" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "network.html"><IMG SRC="5.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly6" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "osis.html"><IMG SRC="6.gif" width="70" height="60" border=0 ></A> </DIV> <SCRIPT LANGUAGE = "JavaScript"> var pos;var ra = 100;var rb = 100;var pi = Math.PI;var inc = pi / 180;var isNS = (navigator.appName == "Netscape" && parseInt (navigator.appVersion) >= 4); var fly1 = (isNS) ? document.fly1 : document.all.fly1.style; var fly2 = (isNS) ? document.fly2 : document.all.fly2.style; var fly3 = (isNS) ? document.fly3 : document.all.fly3.style; var fly4 = (isNS) ? document.fly4 : document.all.fly4.style; var fly5 = (isNS) ? document.fly5 : document.all.fly5.style; var fly6 = (isNS) ? document.fly6 : document.all.fly6.style; var objets; objets = new Array(fly1, fly2, fly3, fly4, fly5, fly6);pos = new Array();pos[0] = 0; for (var i = 1; i < objets.length; i++) {pos[i] = parseFloat(pos[i - 1] + ((2 * pi) / objets.length));} function rotateObjets() { for (var i = 0; i < pos.length; i++) {pos[i] += inc;objets[i].left = (ra * Math.tan(pos[i])) + 250;objets[i].top = (rb * Math.sin(pos[i])) + 165;objets [i].visibility = "visible";} rotateTimer = window.setTimeout("rotateObjets()", 50); } rotateObjets(); </SCRIPT> </body> </html><html> <head> <style> A:link {color:rgb(255,132,72);text-decoration:none} A:hover {color:rgb(255,132,72);text-decoration:underline} A:visited {color:blue;text-decoration:none} </style> </head> <body> <div style="background-image: url('bar-up.gif'); height: 21"> <img src=menu-up.gif width="153" height="21"></div> <br> <br> <div style="height:21"><img src=menu.gif vspace=0 width="140" height="21"></div> <div> <table width=140 border=0 height=27 bgcolor=white style="border:1px solid orange"> <tr> <td valign=top height="37" bgcolor="#FFFFCC" background=bg.gif> <font color="#FF6600" face="Verdana"> <a href="profil.html">Profil</a><BR> <a href=".html">Menu Item 1</a><BR> <a href=".html">Menu Item 2</a><BR> <a href=".html">Menu Item 3</a><BR> <a href=".html">Menu Item 4</a><BR> <a href=".html">Menu Item 5</a><BR> <a href="data.html">Data Base</a> </font> </td> </tr> </table> </div> <BR> <br> <DIV ID = "fly1" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "belajar.html"><IMG SRC="1.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly2" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "komputer.html"><IMG SRC="2.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly3" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="3.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly4" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="4.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly5" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "network.html"><IMG SRC="5.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly6" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "osis.html"><IMG SRC="6.gif" width="70" height="60" border=0 ></A> </DIV> <SCRIPT LANGUAGE = "JavaScript"> var pos;var ra = 100;var rb = 100;var pi = Math.PI;var inc = pi / 180;var isNS = (navigator.appName == "Netscape" && parseInt (navigator.appVersion) >= 4); var fly1 = (isNS) ? document.fly1 : document.all.fly1.style; var fly2 = (isNS) ? document.fly2 : document.all.fly2.style; var fly3 = (isNS) ? document.fly3 : document.all.fly3.style; var fly4 = (isNS) ? document.fly4 : document.all.fly4.style; var fly5 = (isNS) ? document.fly5 : document.all.fly5.style; var fly6 = (isNS) ? document.fly6 : document.all.fly6.style; var objets; objets = new Array(fly1, fly2, fly3, fly4, fly5, fly6);pos = new Array();pos[0] = 0; for (var i = 1; i < objets.length; i++) {pos[i] = parseFloat(pos[i - 1] + ((2 * pi) / objets.length));} function rotateObjets() { for (var i = 0; i < pos.length; i++) {pos[i] += inc;objets[i].left = (ra * Math.cos(pos[i])) + 250;objets[i].top = (rb * Math.tan(pos[i])) + 165;objets [i].visibility = "visible";} rotateTimer = window.setTimeout("rotateObjets()", 50); } rotateObjets(); </SCRIPT> </body> </html> <html> <head> <style> A:link {color:rgb(255,132,72);text-decoration:none} A:hover {color:rgb(255,132,72);text-decoration:underline} A:visited {color:blue;text-decoration:none} </style> </head> <body> <div style="background-image: url('bar-up.gif'); height: 21"> <img src=menu-up.gif width="153" height="21"></div> <br> <br> <div style="height:21"><img src=menu.gif vspace=0 width="140" height="21"></div> <div> <table width=140 border=0 height=27 bgcolor=white style="border:1px solid orange"> <tr> <td valign=top height="37" bgcolor="#FFFFCC" background=bg.gif> <font color="#FF6600" face="Verdana"> <a href="profil.html">Profil</a><BR> <a href=".html">Menu Item 1</a><BR> <a href=".html">Menu Item 2</a><BR> <a href=".html">Menu Item 3</a><BR> <a href=".html">Menu Item 4</a><BR> <a href=".html">Menu Item 5</a><BR> <a href="data.html">Data Base</a> </font> </td> </tr> </table> </div> <BR> <br> <DIV ID = "fly1" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "belajar.html"><IMG SRC="1.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly2" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "komputer.html"><IMG SRC="2.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly3" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="3.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly4" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="4.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly5" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "network.html"><IMG SRC="5.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly6" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "osis.html"><IMG SRC="6.gif" width="70" height="60" border=0 ></A> </DIV> <SCRIPT LANGUAGE = "JavaScript"> var pos;var ra = 100;var rb = 100;var pi = Math.PI;var inc = pi / 180;var isNS = (navigator.appName == "Netscape" && parseInt (navigator.appVersion) >= 4); var fly1 = (isNS) ? document.fly1 : document.all.fly1.style; var fly2 = (isNS) ? document.fly2 : document.all.fly2.style; var fly3 = (isNS) ? document.fly3 : document.all.fly3.style; var fly4 = (isNS) ? document.fly4 : document.all.fly4.style; var fly5 = (isNS) ? document.fly5 : document.all.fly5.style; var fly6 = (isNS) ? document.fly6 : document.all.fly6.style; var objets; objets = new Array(fly1, fly2, fly3, fly4, fly5, fly6);pos = new Array();pos[0] = 0; for (var i = 1; i < objets.length; i++) {pos[i] = parseFloat(pos[i - 1] + ((2 * pi) / objets.length));} function rotateObjets() { for (var i = 0; i < pos.length; i++) {pos[i] += inc;objets[i].left = (ra * Math.cos(pos[i])) + 250;objets[i].top = (rb * Math.atan(pos[i])) + 165;objets [i].visibility = "visible";} rotateTimer = window.setTimeout("rotateObjets()", 50); } rotateObjets(); </SCRIPT> </body> </html> <html> <head> <style> A:link {color:rgb(255,132,72);text-decoration:none} A:hover {color:rgb(255,132,72);text-decoration:underline} A:visited {color:blue;text-decoration:none} </style> </head> <body> <div style="background-image: url('bar-up.gif'); height: 21"> <img src=menu-up.gif width="153" height="21"></div> <br> <br> <div style="height:21"><img src=menu.gif vspace=0 width="140" height="21"></div> <div> <table width=140 border=0 height=27 bgcolor=white style="border:1px solid orange"> <tr> <td valign=top height="37" bgcolor="#FFFFCC" background=bg.gif> <font color="#FF6600" face="Verdana"> <a href="profil.html">Profil</a><BR> <a href=".html">Menu Item 1</a><BR> <a href=".html">Menu Item 2</a><BR> <a href=".html">Menu Item 3</a><BR> <a href=".html">Menu Item 4</a><BR> <a href=".html">Menu Item 5</a><BR> <a href="data.html">Data Base</a> </font> </td> </tr> </table> </div> <BR> <br> <DIV ID = "fly1" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "belajar.html"><IMG SRC="1.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly2" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "komputer.html"><IMG SRC="2.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly3" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="3.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly4" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="4.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly5" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "network.html"><IMG SRC="5.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly6" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "osis.html"><IMG SRC="6.gif" width="70" height="60" border=0 ></A> </DIV> <SCRIPT LANGUAGE = "JavaScript"> var pos;var ra = 100;var rb = 100;var pi = Math.PI;var inc = pi / 180;var isNS = (navigator.appName == "Netscape" && parseInt (navigator.appVersion) >= 4); var fly1 = (isNS) ? document.fly1 : document.all.fly1.style; var fly2 = (isNS) ? document.fly2 : document.all.fly2.style; var fly3 = (isNS) ? document.fly3 : document.all.fly3.style; var fly4 = (isNS) ? document.fly4 : document.all.fly4.style; var fly5 = (isNS) ? document.fly5 : document.all.fly5.style; var fly6 = (isNS) ? document.fly6 : document.all.fly6.style; var objets; objets = new Array(fly1, fly2, fly3, fly4, fly5, fly6);pos = new Array();pos[0] = 0; for (var i = 1; i < objets.length; i++) {pos[i] = parseFloat(pos[i - 1] + ((2 * pi) / objets.length));} function rotateObjets() { for (var i = 0; i < pos.length; i++) {pos[i] += inc;objets[i].left = (ra * Math.tan(pos[i])) + 250;objets[i].top = (rb * Math.atan(pos[i])) + 165;objets [i].visibility = "visible";} rotateTimer = window.setTimeout("rotateObjets()", 50); } rotateObjets(); </SCRIPT> </body> </html> <html> <head> <style> A:link {color:rgb(255,132,72);text-decoration:none} A:hover {color:rgb(255,132,72);text-decoration:underline} A:visited {color:blue;text-decoration:none} </style> </head> <body> <div style="background-image: url('bar-up.gif'); height: 21"> <img src=menu-up.gif width="153" height="21"></div> <br> <br> <div style="height:21"><img src=menu.gif vspace=0 width="140" height="21"></div> <div> <table width=140 border=0 height=27 bgcolor=white style="border:1px solid orange"> <tr> <td valign=top height="37" bgcolor="#FFFFCC" background=bg.gif> <font color="#FF6600" face="Verdana"> <a href="profil.html">Profil</a><BR> <a href=".html">Menu Item 1</a><BR> <a href=".html">Menu Item 2</a><BR> <a href=".html">Menu Item 3</a><BR> <a href=".html">Menu Item 4</a><BR> <a href=".html">Menu Item 5</a><BR> <a href="data.html">Data Base</a> </font> </td> </tr> </table> </div> <BR> <br> <DIV ID = "fly1" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "belajar.html"><IMG SRC="1.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly2" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "komputer.html"><IMG SRC="2.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly3" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="3.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly4" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="4.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly5" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "network.html"><IMG SRC="5.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly6" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "osis.html"><IMG SRC="6.gif" width="70" height="60" border=0 ></A> </DIV> <SCRIPT LANGUAGE = "JavaScript"> var pos;var ra = 100;var rb = 100;var pi = Math.PI;var inc = pi / 180;var isNS = (navigator.appName == "Netscape" && parseInt (navigator.appVersion) >= 4); var fly1 = (isNS) ? document.fly1 : document.all.fly1.style; var fly2 = (isNS) ? document.fly2 : document.all.fly2.style; var fly3 = (isNS) ? document.fly3 : document.all.fly3.style; var fly4 = (isNS) ? document.fly4 : document.all.fly4.style; var fly5 = (isNS) ? document.fly5 : document.all.fly5.style; var fly6 = (isNS) ? document.fly6 : document.all.fly6.style; var objets; objets = new Array(fly1, fly2, fly3, fly4, fly5, fly6);pos = new Array();pos[0] = 0; for (var i = 1; i < objets.length; i++) {pos[i] = parseFloat(pos[i - 1] + ((2 * pi) / objets.length));} function rotateObjets() { for (var i = 0; i < pos.length; i++) {pos[i] += inc;objets[i].left = (ra * Math.atan(pos[i])) + 250;objets[i].top = (rb * Math.atan(pos[i])) + 165;objets [i].visibility = "visible";} rotateTimer = window.setTimeout("rotateObjets()", 50); } rotateObjets(); </SCRIPT> </body> </html> <html> <head> <style> A:link {color:rgb(255,132,72);text-decoration:none} A:hover {color:rgb(255,132,72);text-decoration:underline} A:visited {color:blue;text-decoration:none} </style> </head> <body> <div style="background-image: url('bar-up.gif'); height: 21"> <img src=menu-up.gif width="153" height="21"></div> <br> <br> <div style="height:21"><img src=menu.gif vspace=0 width="140" height="21"></div> <div> <table width=140 border=0 height=27 bgcolor=white style="border:1px solid orange"> <tr> <td valign=top height="37" bgcolor="#FFFFCC" background=bg.gif> <font color="#FF6600" face="Verdana"> <a href="profil.html">Profil</a><BR> <a href=".html">Menu Item 1</a><BR> <a href=".html">Menu Item 2</a><BR> <a href=".html">Menu Item 3</a><BR> <a href=".html">Menu Item 4</a><BR> <a href=".html">Menu Item 5</a><BR> <a href="data.html">Data Base</a> </font> </td> </tr> </table> </div> <BR> <br> <DIV ID = "fly1" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "belajar.html"><IMG SRC="1.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly2" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "komputer.html"><IMG SRC="2.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly3" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="3.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly4" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="4.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly5" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "network.html"><IMG SRC="5.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly6" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "osis.html"><IMG SRC="6.gif" width="70" height="60" border=0 ></A> </DIV> <SCRIPT LANGUAGE = "JavaScript"> var pos;var ra = 100;var rb = 100;var pi = Math.PI;var inc = pi / 180;var isNS = (navigator.appName == "Netscape" && parseInt (navigator.appVersion) >= 4); var fly1 = (isNS) ? document.fly1 : document.all.fly1.style; var fly2 = (isNS) ? document.fly2 : document.all.fly2.style; var fly3 = (isNS) ? document.fly3 : document.all.fly3.style; var fly4 = (isNS) ? document.fly4 : document.all.fly4.style; var fly5 = (isNS) ? document.fly5 : document.all.fly5.style; var fly6 = (isNS) ? document.fly6 : document.all.fly6.style; var objets; objets = new Array(fly1, fly2, fly3, fly4, fly5, fly6);pos = new Array();pos[0] = 0; for (var i = 1; i < objets.length; i++) {pos[i] = parseFloat(pos[i - 1] + ((2 * pi) / objets.length));} function rotateObjets() { for (var i = 0; i < pos.length; i++) {pos[i] += inc;objets[i].left = (ra * Math.random(pos[i])) + 250;objets[i].top = (rb * Math.atan(pos[i])) + 165;objets [i].visibility = "visible";} rotateTimer = window.setTimeout("rotateObjets()", 50); } rotateObjets(); </SCRIPT> </body> </html> <html> <head> <style> A:link {color:rgb(255,132,72);text-decoration:none} A:hover {color:rgb(255,132,72);text-decoration:underline} A:visited {color:blue;text-decoration:none} </style> </head> <body> <div style="background-image: url('bar-up.gif'); height: 21"> <img src=menu-up.gif width="153" height="21"></div> <br> <br> <div style="height:21"><img src=menu.gif vspace=0 width="140" height="21"></div> <div> <table width=140 border=0 height=27 bgcolor=white style="border:1px solid orange"> <tr> <td valign=top height="37" bgcolor="#FFFFCC" background=bg.gif> <font color="#FF6600" face="Verdana"> <a href="profil.html">Profil</a><BR> <a href=".html">Menu Item 1</a><BR> <a href=".html">Menu Item 2</a><BR> <a href=".html">Menu Item 3</a><BR> <a href=".html">Menu Item 4</a><BR> <a href=".html">Menu Item 5</a><BR> <a href="data.html">Data Base</a> </font> </td> </tr> </table> </div> <BR> <br> <DIV ID = "fly1" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "belajar.html"><IMG SRC="1.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly2" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "komputer.html"><IMG SRC="2.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly3" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="3.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly4" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="4.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly5" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "network.html"><IMG SRC="5.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly6" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visibility:hidden;z-index:3;"> <A HREF = "osis.html"><IMG SRC="6.gif" width="70" height="60" border=0 ></A> </DIV> <SCRIPT LANGUAGE = "JavaScript"> var pos;var ra = 100;var rb = 100;var pi = Math.PI;var inc = pi / 180;var isNS = (navigator.appName == "Netscape" && parseInt (navigator.appVersion) >= 4); var fly1 = (isNS) ? document.fly1 : document.all.fly1.style; var fly2 = (isNS) ? document.fly2 : document.all.fly2.style; var fly3 = (isNS) ? document.fly3 : document.all.fly3.style; var fly4 = (isNS) ? document.fly4 : document.all.fly4.style; var fly5 = (isNS) ? document.fly5 : document.all.fly5.style; var fly6 = (isNS) ? document.fly6 : document.all.fly6.style; var objets; objets = new Array(fly1, fly2, fly3, fly4, fly5, fly6);pos = new Array();pos[0] = 0; for (var i = 1; i < objets.length; i++) {pos[i] = parseFloat(pos[i - 1] + ((2 * pi) / objets.length));} function rotateObjets() { for (var i = 0; i < pos.length; i++) {pos[i] += inc;objets[i].left = (ra * Math.floor(pos[i])) + 150;objets[i].top = (rb * Math.atan(pos[i])) + 165;objets [i].visibility = "visible";} rotateTimer = window.setTimeout("rotateObjets()", 50); } rotateObjets(); </SCRIPT> </body> </html> <html> <head> <style> A:link {color:rgb(255,132,72);text-decoration:none} A:hover {color:rgb(255,132,72);text-decoration:underline} A:visited {color:blue;text-decoration:none} </style> </head> <body> <div style="background-image: url('bar-up.gif'); height: 21"> <img src=menu-up.gif width="153" height="21"></div> <br> <br> <div style="height:21"><img src=menu.gif vspace=0 width="140" height="21"></div> <div> <table width=140 border=0 height=27 bgcolor=white style="border:1px solid orange"> <tr> <td valign=top height="37" bgcolor="#FFFFCC" background=bg.gif> <font color="#FF6600" face="Verdana"> <a href="profil.html">Profil</a><BR> <a href=".html">Menu Item 1</a><BR> <a href=".html">Menu Item 2</a><BR> <a href=".html">Menu Item 3</a><BR> <a href=".html">Menu Item 4</a><BR> <a href=".html">Menu Item 5</a><BR> <a href="data.html">Data Base</a> </font> </td> </tr> </table> </div> <BR> <br> <DIV ID = "fly1" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visib ility:hidden;z-index:3;"> <A HREF = "belajar.html"><IMG SRC="1.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly2" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visib ility:hidden;z-index:3;"> <A HREF = "komputer.html"><IMG SRC="2.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly3" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visib ility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="3.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly4" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visib ility:hidden;z-index:3;"> <A HREF = "denah.html"><IMG SRC="4.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly5" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visib ility:hidden;z-index:3;"> <A HREF = "network.html"><IMG SRC="5.gif" width="70" height="60" border=0 ></A> </DIV> <DIV ID = "fly6" STYLE="position:absolute;left:0px;top:0px;width:40px;height:40px;visib ility:hidden;z-index:3;"> <A HREF = "osis.html"><IMG SRC="6.gif" width="70" height="60" border=0 ></A> </DIV> <SCRIPT LANGUAGE = "JavaScript"> var pos;var ra = 100;var rb = 100;var pi = Math.PI;var inc = pi / 180;var isNS = (navigator.appName == "Netscape" && parseInt (navigator.appVersion) >= 4); var fly1 = (isNS) ? document.fly1 : document.all.fly1.style; var fly2 = (isNS) ? document.fly2 : document.all.fly2.style; var fly3 = (isNS) ? document.fly3 : document.all.fly3.style; var fly4 = (isNS) ? document.fly4 : document.all.fly4.style; var fly5 = (isNS) ? document.fly5 : document.all.fly5.style; var fly6 = (isNS) ? document.fly6 : document.all.fly6.style; var objets; objets = new Array(fly1, fly2, fly3, fly4, fly5, fly6);pos = new Array();pos[0] = 0; for (var i = 1; i < objets.length; i++) {pos[i] = parseFloat(pos[i - 1] + ((2 * pi) / objets.length));} function rotateObjets() { for (var i = 0; i < pos.length; i++) {pos[i] += inc;objets[i].left = (ra * Math.floor(pos[i])) + 150;objets[i].top = (rb * Math.sin(pos[i])) + 165;objets [i].visibility = "visible";} rotateTimer = window.setTimeout("rotateObjets()", 50); } rotateObjets(); </SCRIPT> </body> </html>

Sabtu, 15 November 2025

javascript taken from DHTML.SEITE.NET

<html><head><title>DHTML.SEITE.NET - &Uuml;berblendungen mit dem IE - Beispiel</title>



<script language="javascript">

<!--


/*

Titel: DHTML Ueberblendungen mit dem IE

Autor: Christoph Bergmann

WWW: http://acc.de

EMail: cb@acc.de


Copyright (c) Milch und Zucker - c. Bergmann und j. Gamperl, 1998. 

All rights reserved. Alle Rechte vorbehalten. URL: http://dhtml.seite.net


Dieser Code darf für nicht-kommerzielle, sowie kommerzielle Zwecke frei

genutzt und angepaßt werden, solange dies unentgeltlich erfolgt und

dieser Vermerk bestehen bleibt. 

*/


var x=0;

var y=0;

var delay=4000;


text=new Array

(

'Milch&Zucker...',

'...die deutsche DHTML-Seite...',

'...pr&auml;sentiert...',

'...die unglaublichsten...',

'...fantastischsten, niemals erahnten...',

'...DHTML-&Uuml;berblendungen...',

'...die Sie je gesehen haben!!!'

);


function ietrans()

{

f1.filters[0].apply();

f1.innerHTML=text[x];

f1.filters[0].Transition=y;

f1.filters[0].play();


x=++x<text.length?x:0;

y=++y<23?y:0;


setTimeout("ietrans()", delay)

}

 

</script>

</head>


<body bgcolor=blue onload="ietrans()">


<div id="f1" style="position: absolute; top:10; left:10; font-size:60; color: white; text-align:center; filter: revealTrans(Duration=2)"></div>


</body></html>

JavaScript taken from Voila.fr

 <HTML>

<HEAD>

<TITLE>JAVA SCRIPT</TITLE>


</HEAD>


<BODY BGCOLOR="#ffffff" TEXT="lilac"  LEFTMARGIN="0" TOPMARGIN="0" MARGINWIDTH="0" MARGINHEIGHT="0" onload="init_layers()">



<div id="pub01" style="position:absolute; top:0px; left:0px; z-index:1; visibility:visible"><a href="menu.html" target="_blank"><img src="s1.bmp" name="test_01" width="47" height="28" border="0"></a></div> 

<div id="pub02" style="position:absolute; top:0px; left:47px; z-index:2; visibility:visible"><a href="menu.html" target="_blank"><img src="m2.bmp" name="test_02" width="40" height="28" border="0"></a></div> 

<div id="pub03" style="position:absolute; top:0px; left:87px; z-index:3; visibility:visible"><a href="menu.html" target="_blank"><img src="u1.bmp" name="test_03" width="44" height="28" border="0"></a></div>

<div id="pub04" style="position:absolute; top:0px; left:131px; z-index:4; visibility:visible"><a href="menu.html" target="_blank"><img src="n1.bmp" name="test_04" width="48" height="28" border="0"></a></div>

<div id="pub05" style="position:absolute; top:0px; left:179px; z-index:5; visibility:visible"><a href="menu.html"target="_blank"><img src="31.bmp" name="test_05" width="37" height="28" border="0"></a></div>

<div id="pub06" style="position:absolute; top:0px; left:216px; z-index:6; visibility:visible"><a href="menu.html" target="_blank"><img src="c1.bmp" name="test_06" width="24" height="28" border="0"></a></div>

<div id="pub07" style="position:absolute; top:0px; left:234px; z-index:7; visibility:visible"><a href="menu.html" target="_blank"><img src="i1.bmp" name="test_07" width="28" height="28" border="0"></a></div>



<SCRIPT LANGUAGE="JavaScript">

//////webmaster= DUDI GUNAWAN, S.PD, JL.Tentara Pelajar Ciamis 766. Tlp. (0265)775375/////

if (document.all){

        doc = "document.all";

        sty = ".style";

        pub01Img = pub02Img = pub03Img = pub04Img = pub05Img = pub06Img = pub07Img = "document";

}

if (document.layers){

        doc = "document";

        sty = "";

        pub01Img = doc + '["pub01"].' + doc;

        pub02Img = doc + '["pub02"].' + doc;

        pub03Img = doc + '["pub03"].' + doc;

        pub04Img = doc + '["pub04"].' + doc;

        pub05Img = doc + '["pub05"].' + doc;

        pub06Img = doc + '["pub06"].' + doc;

        pub07Img = doc + '["pub07"].' + doc;

}


var etat = "fixeesverseclatees";

var coords01_fixees_top, coords02_fixees_top, coords03_fixees_top, coords04_fixees_top, coords05_fixees_top, coords06_fixees_top, coords07_fixees_top, coords08_fixees_top, coords09_fixees_top

var coords01_fixees_left, coords02_fixees_left, coords03_fixees_left, coords04_fixees_left, coords05_fixees_left, coords06_fixees_left, coords07_fixees_left, coords08_fixees_left, coords09_fixees_left

var coords01_eclatees_top, coords02_eclatees_top, coords03_eclatees_top, coords04_eclatees_top, coords05_eclatees_top, coords06_eclatees_top, coords07_eclatees_top

var coords01_eclatees_left, coords02_eclatees_left, coords03_eclatees_left, coords04_eclatees_left, coords05_eclatees_left, coords06_eclatees_left, coords07_eclatees_left

var aaa = bbb = new Array();

var j = 0;

var test = "test";



function init_layers(){

        if (document.images){

                imgpub01 = new Image();

                imgpub01.src = "s1.bmp";

                imgpub02 = new Image();

                imgpub02.src = "m2.bmp";

                imgpub03 = new Image();

                imgpub03.src = "u1.bmp";

                imgpub04 = new Image();

                imgpub04.src = "n1.bmp";

                imgpub05 = new Image();

                imgpub05.src = "31.bmp";

                imgpub06 = new Image();

                imgpub06.src = "c1.bmp";

                imgpub07 = new Image();

                imgpub07.src = "i1.bmp";

        }

        pub01Obj = eval(doc + '["pub01"]' + sty);

        pub02Obj = eval(doc + '["pub02"]' + sty);

        pub03Obj = eval(doc + '["pub03"]' + sty);

        pub04Obj = eval(doc + '["pub04"]' + sty);

        pub05Obj = eval(doc + '["pub05"]' + sty);

        pub06Obj = eval(doc + '["pub06"]' + sty);

        pub07Obj = eval(doc + '["pub07"]' + sty);

        lance_boucle();

}


function coords_fixees(){

        coords01_fixees_top = 300 * Math.random();

        coords01_fixees_left = 10;


        coords02_fixees_top = coords01_fixees_top;

        coords02_fixees_left = coords01_fixees_left + 47;


        coords03_fixees_top = coords01_fixees_top;

        coords03_fixees_left = coords01_fixees_left + 87;


        coords04_fixees_top = coords01_fixees_top;

        coords04_fixees_left = coords01_fixees_left + 131;


        coords05_fixees_top = coords01_fixees_top;

        coords05_fixees_left = coords01_fixees_left + 179;


        coords06_fixees_top = coords01_fixees_top;

        coords06_fixees_left = coords01_fixees_left + 216;


        coords07_fixees_top = coords01_fixees_top;

        coords07_fixees_left = coords01_fixees_left + 239;

}




function move_to_newplace(sens){

        if ((parseInt(pub01Obj.top) <= coords01_fixees_top) && (sens != "montee") && (sens != "descente")){

                sens = "montee";

                for (i=1; i<=7; i++){

                        eval("pub0" + i + "Obj.top = parseInt(pub0" + i + "Obj.top) + 5");

                }

                direct = sens;

                setTimeout("move_to_newplace(direct)", 100);

        }

        else if ((parseInt(pub01Obj.top) >= coords01_fixees_top) && (sens != "montee") && (sens != "descente")){

                sens = "descente";

                for (i=1; i<=7; i++){

                        eval("pub0" + i + "Obj.top = parseInt(pub0" + i + "Obj.top) - 5");

                }

                direct = sens;

                setTimeout("move_to_newplace(direct)", 100);

        }

        else if ((sens == "montee")&&(parseInt(pub01Obj.top) <= coords01_fixees_top)){

                for (i=1; i<=7; i++){

                        eval("pub0" + i + "Obj.top = parseInt(pub0" + i + "Obj.top) + 5");

                }

                direct = sens;

                setTimeout("move_to_newplace(direct)", 100);

        }

        else if ((sens == "descente") && (parseInt(pub01Obj.top) >= coords01_fixees_top)){

                for (i=1; i<=7; i++){

                        eval("pub0" + i + "Obj.top = parseInt(pub0" + i + "Obj.top) - 5");

                }

                direct = sens;

                setTimeout("move_to_newplace(direct)", 100);

        }

        else {

                coords_eclatees();

                coeff_mvt();

        }

}




function coords_eclatees(){

        for (i=1; i<=7; i++){

                signe = Math.random();

                if (signe <= 0.5) { signe = -1; }

                else { signe = 1; }


                eval("coords0" + i + "_eclatees_top = coords0" + i + "_fixees_top + (signe * Math.random() * 130)");

                eval("coords0" + i + "_eclatees_left = coords0" + i + "_fixees_left + 130 * Math.sqrt(1 - Math.pow(((coords0" + i + "_eclatees_top - coords0" + i + "_fixees_top)/130),2))");

        }

}


function coeff_mvt(){

        for(i=1; i<=7; i++){

                eval("aaa[i] = Math.round(coords0" + i + "_eclatees_top - coords0" + i + "_fixees_top) / Math.round(coords0" + i + "_eclatees_left - coords0" + i + "_fixees_left)");

                eval("bbb0" + i + " = coords0" + i + "_eclatees_top - aaa[i] * (coords0" + i + "_eclatees_left)");

        }

        coords_mvt_open();

}




function coords_mvt_open(){

        if (j == 0){

                for(k=1; k<=7; k++){

                        eval("pub0" + k + "Obj.left = coords0" + k + "_fixees_left");

                        eval("pub0" + k + "Obj.top = coords0" + k + "_fixees_top");

                }

                j += 5;

                setTimeout("coords_mvt_open()", 100);

        }

        else if (j <= 40){

                for(k=1; k<=7; k++){

                        if (Math.abs(aaa[k]) <= 1){

                                        eval("pub0" + k + "Obj.left = parseInt(pub0" + k + "Obj.left) + j");

                                        eval("pub0" + k + "Obj.top = parseInt(pub0" + k + "Obj.left) * aaa[k] + bbb0" + k);

                        }

                        else if (aaa[k] <= 0){

                                        eval("pub0" + k + "Obj.top = parseInt(pub0" + k + "Obj.top) + j");                                        eval("pub0" + k + "Obj.left = (parseInt(pub0" + k + "Obj.top) - bbb0" + k + ") / aaa[k]");

                        }

                        else {

                                        eval("pub0" + k + "Obj.top = parseInt(pub0" + k + "Obj.top) - j");                                        eval("pub0" + k + "Obj.left = (parseInt(pub0" + k + "Obj.top) - bbb0" + k + ") / aaa[k]");

                        }

                }

                j += 5;

                setTimeout("coords_mvt_open();",100);

        }

        else {

                setTimeout("replace_img();", 30);

        }

}


function replace_img(){

        if (test == "test"){

                eval(pub01Img + ".test_01.src = \"s1.bmp\"");

                eval(pub02Img + ".test_02.src = \"m2.bmp\"");

                eval(pub03Img + ".test_03.src = \"u1.bmp\"");

                eval(pub04Img + ".test_04.src = \"n1.bmp\"");

                eval(pub05Img + ".test_05.src = \"31.bmp\"");

                eval(pub06Img + ".test_06.src = \"c1.bmp\"");

                eval(pub07Img + ".test_07.src = \"i1.bmp\"");

                test = "test2";

        }

        else {

                eval(pub01Img + ".test_01.src = \"s2.bmp\"");

                eval(pub02Img + ".test_02.src = \"m3.bmp\"");

                eval(pub03Img + ".test_03.src = \"u2.bmp\"");

                eval(pub04Img + ".test_04.src = \"n2.bmp\"");

                eval(pub05Img + ".test_05.src = \"32.bmp\"");

                eval(pub06Img + ".test_06.src = \"c2.bmp\"");

                eval(pub07Img + ".test_07.src = \"i2.bmp\"");

                test = "test";

        }

        coords_mvt_close();

}




function coords_mvt_close(){

        if (j == 45) j = 40;

        if (j >= 5){

                for(k=1; k<=7; k++){

                        if (Math.abs(aaa[k]) <= 1){

                                        eval("pub0" + k + "Obj.left = parseInt(pub0" + k + "Obj.left) - j");

                                        eval("pub0" + k + "Obj.top = parseInt(pub0" + k + "Obj.left) * aaa[k] + bbb0" + k + "");

                        }

                        else if (aaa[k] <= 0){

                                        eval("pub0" + k + "Obj.top = parseInt(pub0" + k + "Obj.top) - j");                                        eval("pub0" + k + "Obj.left = (parseInt(pub0" + k + "Obj.top) - bbb0" + k + ") / aaa[k]");

                        }

                        else {

                                        eval("pub0" + k + "Obj.top = parseInt(pub0" + k + "Obj.top) + j");                                        eval("pub0" + k + "Obj.left = (parseInt(pub0" + k + "Obj.top) - bbb0" + k + ") / aaa[k]");

                        }

                }

                j -= 5;

                setTimeout("coords_mvt_close();",100);

        }

        else if (j == 0){

                for(k=1; k<=7; k++){

                        eval("pub0" + k + "Obj.left = coords0" + k + "_fixees_left");

                        eval("pub0" + k + "Obj.top = coords0" + k + "_fixees_top");

                }

                j -= 5;

                setTimeout("coords_mvt_close();",100);

        }

        else {

                j = 0;

                setTimeout("lance_boucle();", 100);

        }

}



function lance_boucle(){

        coords_fixees();

        move_to_newplace();

}

</SCRIPT>





</BODY>

</HTML>


Javascript taken from Help->About on IE 4... Copyright 1997 Macromedia, Inc. All rights reserved.

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">

<HTML>

<HEAD>

<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">

<title>Introducing Microsoft FrontPage Express</title>

<META NAME=MS-HAID Content="create_webs">

<link rel="stylesheet" type="text/css" href="basicIE4.css">


<style>

<!--

.helper {  font-family: Verdana, Arial, Helvetica, MS Sans Serif, sans-serif; font-size: 34pt; letter-spacing: -3pt}

.clsNormal { font-family: Verdana, Arial, Helvetica, MS Sans Serif, sans-serif; padding: .5em; color:#cccccc}

.clsDynaText { font-family: Verdana, Arial, Helvetica, MS Sans Serif, sans-serif; padding: .5em; color:#000000;}


-->

</style>


<SCRIPT LANGUAGE="JavaScript">

<!--

var sPlainText 

var iTick = 100

var j = 0

var sOffID

window.onload = doOnload

function doOnload() {

idDynaText.innerHTML = replaceChars(idDynaText.innerText," ","&nbsp;")

sPlainText = idDynaText.innerText

getString()

}

function getString() {

sDynaText = ""

for (i=0;i<sPlainText.length;i++){

sDynaText += "<SPAN ID=idDynaChar" + i + " CLASS=clsNormal>" + sPlainText.substring(i,i+1) + "</SPAN>"

}

idDynaText.innerHTML = sDynaText

window.setTimeout("doDynaText()",iTick)

}


function doDynaText() {

if (null != sOffID) {

// document.all(sOnID).className = "clsNormal"

}

sOnID = "idDynaChar" + (j)

document.all(sOnID).className = "clsDynaText"

sOffID = sOnID

j++

if (j < sPlainText.length ) {

window.setTimeout("doDynaText()",iTick)

}

else {

if (null != sOffID) {

// window.setTimeout("document.all(sOnID).className = 'clsNormal'",iTick)

}

}

}


function replaceChars(sString,sOld,sNew) {

for (i = 0; i < sString.length; i++) {

if (sString.substring(i, i + sOld.length) == sOld) {

sString = sString.substring(0, i) + sNew + sString.substring(i + sOld.length, sString.length)

}

}

return sString

}

-->

</SCRIPT>

<script language="JavaScript">

<!--

function MM_initTimelines() {

    //MM_initTimelines() Copyright 1997 Macromedia, Inc. All rights reserved.

    var ns = navigator.appName == "Netscape";

    document.MM_Time = new Array(2);

    document.MM_Time[0] = new Array(7);

    document.MM_Time["Timeline1"] = document.MM_Time[0];

    document.MM_Time[0].MM_Name = "Timeline1";

    document.MM_Time[0].fps = 15;

    document.MM_Time[0][0] = new String("sprite");

    document.MM_Time[0][0].slot = 1;

    if (ns)

        document.MM_Time[0][0].obj = document.GREENlay;

    else

        document.MM_Time[0][0].obj = document.all ? document.all["GREENlay"] : null;

    document.MM_Time[0][0].keyFrames = new Array(1, 30);

    document.MM_Time[0][0].values = new Array(2);

    document.MM_Time[0][0].values[0] = new Array


(79,83,88,92,97,101,105,110,114,119,123,128,132,136,141,145,150,154,158,163,167,172,176,181,185,189,194,198,203,207);

    document.MM_Time[0][0].values[0].prop = "left";

    document.MM_Time[0][0].values[1] = new Array(15,16,17,19,20,21,22,23,24,26,27,28,29,30,31,33,34,35,36,37,38,40,41,42,43,44,45,47,48,49);

    document.MM_Time[0][0].values[1].prop = "top";

    if (!ns) {

        document.MM_Time[0][0].values[0].prop2 = "style";

        document.MM_Time[0][0].values[1].prop2 = "style";

    }

    document.MM_Time[0][1] = new String("sprite");

    document.MM_Time[0][1].slot = 3;

    if (ns)

        document.MM_Time[0][1].obj = document.BLUElay;

    else

        document.MM_Time[0][1].obj = document.all ? document.all["BLUElay"] : null;

    document.MM_Time[0][1].keyFrames = new Array(1, 30);

    document.MM_Time[0][1].values = new Array(2);

    document.MM_Time[0][1].values[0] = new Array


(209,206,204,201,199,196,194,191,189,186,184,181,179,176,174,171,169,166,164,161,159,156,154,151,149,146,144,141,139,136);

    document.MM_Time[0][1].values[0].prop = "left";

    document.MM_Time[0][1].values[1] = new Array(-50,-50,-50,-50,-50,-50,-50,-50,-50,-50,-50,-50,-50,-50,-50,-50,-50,-50,-50,-50,-50,-50,-50,-50,-50,-


50,-50,-50,-50,-50);

    document.MM_Time[0][1].values[1].prop = "top";

    if (!ns) {

        document.MM_Time[0][1].values[0].prop2 = "style";

        document.MM_Time[0][1].values[1].prop2 = "style";

    }

    document.MM_Time[0][2] = new String("sprite");

    document.MM_Time[0][2].slot = 5;

    if (ns)

        document.MM_Time[0][2].obj = document.YELLlay;

    else

        document.MM_Time[0][2].obj = document.all ? document.all["YELLlay"] : null;

    document.MM_Time[0][2].keyFrames = new Array(1, 30);

    document.MM_Time[0][2].values = new Array(2);

    document.MM_Time[0][2].values[0] = new Array(84,81,77,74,71,68,64,61,58,55,51,48,45,41,38,35,32,28,25,22,18,15,12,9,5,2,-1,-4,-8,-11);

    document.MM_Time[0][2].values[0].prop = "left";

    document.MM_Time[0][2].values[1] = new Array(0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0);

    document.MM_Time[0][2].values[1].prop = "top";

    if (!ns) {

        document.MM_Time[0][2].values[0].prop2 = "style";

        document.MM_Time[0][2].values[1].prop2 = "style";

    }

    document.MM_Time[0][3] = new String("sprite");

    document.MM_Time[0][3].slot = 6;

    if (ns)

        document.MM_Time[0][3].obj = document.YELLlay ? document.YELLlay.document.YELLlayIN : document.YELLlayIN;

    else

        document.MM_Time[0][3].obj = document.all ? document.all["YELLlayIN"] : null;

    document.MM_Time[0][3].keyFrames = new Array(30, 32, 33, 34, 35);

    document.MM_Time[0][3].values = new Array(2);

    document.MM_Time[0][3].values[0] = new Array(-130,-99,-73,-47,-20,12);

    document.MM_Time[0][3].values[0].prop = "left";

    document.MM_Time[0][3].values[1] = new Array(6,6,6,6,6,6);

    document.MM_Time[0][3].values[1].prop = "top";

    if (!ns) {

        document.MM_Time[0][3].values[0].prop2 = "style";

        document.MM_Time[0][3].values[1].prop2 = "style";

    }

    document.MM_Time[0][4] = new String("sprite");

    document.MM_Time[0][4].slot = 8;

    if (ns)

        document.MM_Time[0][4].obj = document.gray1;

    else

        document.MM_Time[0][4].obj = document.all ? document.all["gray1"] : null;

    document.MM_Time[0][4].keyFrames = new Array(1, 30);

    document.MM_Time[0][4].values = new Array(3);

    document.MM_Time[0][4].values[0] = new Array


(189,185,180,176,172,168,163,159,155,151,146,142,138,133,129,125,121,116,112,108,103,99,95,91,86,82,78,74,69,65);

    document.MM_Time[0][4].values[0].prop = "left";

    document.MM_Time[0][4].values[1] = new Array(17,18,19,20,22,23,24,25,26,27,28,30,31,32,33,34,35,36,37,39,40,41,42,43,44,45,47,48,49,50);

    document.MM_Time[0][4].values[1].prop = "top";

    if (!ns) {

        document.MM_Time[0][4].values[0].prop2 = "style";

        document.MM_Time[0][4].values[1].prop2 = "style";

    }

    document.MM_Time[0][4].values[2] = new Array("25","75");

    document.MM_Time[0][4].values[2].prop = "zIndex";

    if (!ns)

        document.MM_Time[0][4].values[2].prop2 = "style";

    document.MM_Time[0][5] = new String("sprite");

    document.MM_Time[0][5].slot = 10;

    if (ns)

        document.MM_Time[0][5].obj = document.Help2;

    else

        document.MM_Time[0][5].obj = document.all ? document.all["Help2"] : null;

    document.MM_Time[0][5].keyFrames = new Array(10, 30);

    document.MM_Time[0][5].values = new Array(6);

    document.MM_Time[0][5].values[0] = new Array(97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97,97);

    document.MM_Time[0][5].values[0].prop = "left";

    document.MM_Time[0][5].values[1] = new Array(35,35,35,35,35,35,35,35,35,35,35,35,35,35,35,35,35,35,35,35,35);

    document.MM_Time[0][5].values[1].prop = "top";

    if (!ns) {

        document.MM_Time[0][5].values[0].prop2 = "style";

        document.MM_Time[0][5].values[1].prop2 = "style";

    }

    document.MM_Time[0][5].values[2] = new Array(5,10,20,30,40,50,60,70,80,90,100,130,140,160,180,200,220,240,260,280,300);

    document.MM_Time[0][5].values[2].prop = "width";

    if (!ns)

        document.MM_Time[0][5].values[2].prop2 = "style";

    document.MM_Time[0][5].values[3] = new Array(0,2,3,5,10,15,20,25,30,35,40,45,50,60,80,100,120,140,160,180,200);

    document.MM_Time[0][5].values[3].prop = "height";

    if (!ns)

        document.MM_Time[0][5].values[3].prop2 = "style";

    document.MM_Time[0][5].values[4] = new Array("4000","4000");

    document.MM_Time[0][5].values[4].prop = "zIndex";

    if (!ns)

        document.MM_Time[0][5].values[4].prop2 = "style";

    document.MM_Time[0][5].values[5] = new Array("inherit","inherit");

    document.MM_Time[0][5].values[5].prop = "visibility";

    if (!ns)

        document.MM_Time[0][5].values[5].prop2 = "style";

    document.MM_Time[0][6] = new String("sprite");

    document.MM_Time[0][6].slot = 12;

    if (ns)

        document.MM_Time[0][6].obj = document.iexplor2;

    else

        document.MM_Time[0][6].obj = document.all ? document.all["iexplor2"] : null;

    document.MM_Time[0][6].keyFrames = new Array(12, 30);

    document.MM_Time[0][6].values = new Array(3);

    document.MM_Time[0][6].values[0] = new Array(61,61,61,61,61,61,61,61,61,61,61,61,61,61,61,61,61,61,61);

    document.MM_Time[0][6].values[0].prop = "left";

    document.MM_Time[0][6].values[1] = new Array(-58,-54,-50,-46,-42,-38,-34,-30,-26,-22,-17,-13,-9,-5,-1,3,7,11,15);

    document.MM_Time[0][6].values[1].prop = "top";

    if (!ns) {

        document.MM_Time[0][6].values[0].prop2 = "style";

        document.MM_Time[0][6].values[1].prop2 = "style";

    }

    document.MM_Time[0][6].values[2] = new Array("5","5");

    document.MM_Time[0][6].values[2].prop = "zIndex";

    if (!ns)

        document.MM_Time[0][6].values[2].prop2 = "style";

    document.MM_Time[0].lastFrame = 35;

    document.MM_Time[1] = new Array(0);

    document.MM_Time["Timeline2"] = document.MM_Time[1];

    document.MM_Time[1].MM_Name = "Timeline2";

    document.MM_Time[1].fps = 15;

    document.MM_Time[1].lastFrame = 0;

    for (i=0; i<document.MM_Time.length; i++) {

        document.MM_Time[i].ID = null;

        document.MM_Time[i].curFrame = 0;

        document.MM_Time[i].delay = 1000/document.MM_Time[i].fps;

    }

}

//-->

</script>

  <script language="JavaScript">

<!--

function MM_timelinePlay(tmLnName, myID) { //v1.2

  //Copyright 1997 Macromedia, Inc. All rights reserved.

  var i,j,tmLn,props,keyFrm,sprite,numKeyFr,firstKeyFr,propNum,theObj,firstTime=false;

  if (document.MM_Time == null) MM_initTimelines(); //if *very* 1st time

  tmLn = document.MM_Time[tmLnName];

  if (myID == null) { myID = ++tmLn.ID; firstTime=true;}//if new call, incr ID

  if (myID == tmLn.ID) { //if Im newest

    setTimeout('MM_timelinePlay("'+tmLnName+'",'+myID+')',tmLn.delay);

    fNew = ++tmLn.curFrame;

    for (i=0; i<tmLn.length; i++) {

      sprite = tmLn[i];

      if (sprite.charAt(0) == 's') {

        if (sprite.obj) {

          numKeyFr = sprite.keyFrames.length; firstKeyFr = sprite.keyFrames[0];

          if (fNew >= firstKeyFr && fNew <= sprite.keyFrames[numKeyFr-1]) {//in range

            keyFrm=1;

            for (j=0; j<sprite.values.length; j++) {

              props = sprite.values[j]; 

              if (numKeyFr != props.length) {

                if (props.prop2 == null) sprite.obj[props.prop] = props[fNew-firstKeyFr];

                else        sprite.obj[props.prop2][props.prop] = props[fNew-firstKeyFr];

              } else {

                while (keyFrm<numKeyFr && fNew>=sprite.keyFrames[keyFrm]) keyFrm++;

                if (firstTime || fNew==sprite.keyFrames[keyFrm-1]) {

                  if (props.prop2 == null) sprite.obj[props.prop] = props[keyFrm-1];

                  else        sprite.obj[props.prop2][props.prop] = props[keyFrm-1];

        } } } } }

      } else if (sprite.charAt(0)=='b' && fNew == sprite.frame) eval(sprite.value);

      if (fNew > tmLn.lastFrame) tmLn.ID = 0;

  } }

}

//-->

</script>

</HEAD>


<BODY onLoad="MM_timelinePlay('Timeline1')" style="font-family:Arial">

<div id="gray1" style="position:absolute; width:30px; height:30px; z-index:25; background-color: #CFCFCF; left: 189px; top: 17px"> 

  <div id="white1" style="position:absolute; width:18px; height:18px; z-index:76; background-color: blue; left: 6px; top: 6px; overflow: 


hidden"></div>

</div>

<div id="BLUElay" style="position:absolute; width:470px; height:470px; border:1px solid magenta;z-index:100; left: 209px; top: -50px"> 

  aaaaaa</div>

<div id="GREENlay" style="position:absolute; border:1px solid green;width:321px; height:321px; z-index:200; left: 79px; top: 15px"> 

</div>

<div id="YELLlay" style="position:absolute; width:270px; height:270px; z-index:50; background-color: #FFCC00; top: 0px; left: 84px"> 

  <div id="YELLlayINW" style="position:absolute; width:46px; height:46px; z-index:26; left: 12px; top: 10px; border:1px solid red;background-


color: lime; overflow: hidden"> 

    <div align="center"></div>

  </div>

  <div id="YELLlayIN" style="position:absolute; width:346px; height:86px; BORDER:1px solid black;z-index:55; left: -130px; top: 6px; overflow: 


visible"> 

    <div align="center">tes tes !</div>

  </div>

</div>

<div id="Help2" style="position:absolute; width:0px; height:0px;border:1px solid orange;background-color:yellow; z-index:4000; left:97px; 


top:35px; overflow: hidden; visibility: inherit"> 

  <span class="helper">Test tes</span> </div>

<div id="iexplor2" style="position:absolute; width:206px; height:243px;border:1px solid purple; z-index:5; left:61px; top:-58px"> 

 </div>


</BODY>

</HTML>