I apologize but I forgot to insert the script in my previous post. Here it is:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>Cross-browser Dynamic HTML Demo - Circle animation demo</TITLE>
<META http-equiv=Content-Type content="text/html; charset=windows-1252">
<META content="Thomas Brattli (webmaster@bratta.com)" name=Author>
<META
content="DHTML, HTML, dhtml, html, demos, Javascript, VBscript, Cross-browser, Netscape4.0, IE4.0, Internet explorer, Dynamic HTML"
name=KeyWords>
<META content="Animated DHTML circle demo" name=Description>
<STYLE>DIV {
POSITION: absolute
}
DIV.clButtons {
LEFT: 98px; VISIBILITY: inherit; WIDTH: 22px; TOP: 6px; HEIGHT: 22px
}
#divCont {
Z-INDEX: 30; VISIBILITY: visible; WIDTH: 220px; CLIP: rect(0px 220px 220px 0px); HEIGHT: 220px
}
#divCenter {
LEFT: 10px; VISIBILITY: inherit; WIDTH: 200px; TOP: 10px; HEIGHT: 200px
}
</STYLE>
<SCRIPT>
/************************************************** *************************
Copyright (C) 1999 Thomas Brattli
Code made by and copyrighted to Thomas Brattli from
www.bratta.com. Can be used freely as long as this message is instact
************************************************** **************************/
//Simple browsercheck
var n = (document.layers) ? 1:0;
var ie = (document.all) ? 1:0;
/************************************************** *************************
Main variables
************************************************** **************************/
//The radius for the circle
radius=92
//Start angle
startAngle=90
//Speed in milliseconds
circleSpeed=20
//angle to move per timeout
moveAngle=5
var xcenter;
var ycenter;
var menuState;
var circleGoing;
/************************************************** *************************
Object constructors; making Cross-browser object of the buttons
************************************************** **************************/
function makeButton(obj,nest,stop){
nest=(!nest) ? '':'document.'+nest+'.'
this.css=(n) ? eval(nest+'document.'+obj):eval('document.all.'+ob j+'.style')
this.ref=(n) ? eval(nest+'document.'+obj+'.document'):eval('docum ent');
this.x=(n)? this.css.left:this.css.pixelLeft;
this.y=(n)? this.css.top:this.css.pixelTop;
this.moveIt=b_moveIt
this.stop=stop
return this
}
function b_moveIt(x,y){
this.x=x; this.y=y
this.css.left=this.x
this.css.top=this.y
}
/************************************************** *************************
Initiating the buttons and starts the circlemove
************************************************** **************************/
function init(num){
//Getting the height and width of the document
pageWidth=(n)?innerWidth:document.body.offsetWidth ;
pageHeight=(n)?innerHeight:document.body.offsetHei ght;
//Making a simple object for the divCont
oCont=(n)?eval('document.divCont'):eval('divCont.s tyle')
//Moving the divCont to the center of the page.
oCont.left=pageWidth/2-110
oCont.top=pageHeight/2-110
//Making an array to hold the button objects
oBut=new Array()
//Making button objects, arguments: divName,nested div,anglestop
oBut[0]=new makeButton('div0','divCont',0)
oBut[1]=new makeButton('div1','divCont',30)
oBut[2]=new makeButton('div2','divCont',-30)
oBut[3]=new makeButton('div3','divCont',-90)
oBut[4]=new makeButton('div4','divCont',-150)
oBut[5]=new makeButton('div5','divCont',-210)
//Moves the button; ie5 bugfix
if(ie) oBut[0].moveIt(98,6)
//Starts the circlemove
xcenter = oBut[0].x - radius*Math.cos(startAngle*Math.PI/180)
ycenter = oBut[0].y + radius*Math.sin(startAngle*Math.PI/180)
circleGo(radius,-moveAngle,startAngle,oBut[5].stop,xcenter,ycenter,'menuState=1')
}
/************************************************** *************************
Moves the buttons in a circle
************************************************** **************************/
function circleGo(radius,angleinc,angle,endangle,xcenter,yc enter,fn) {
//if angleinc < endangle-angle (no matter if it's positive or negative numbers)
if ((Math.abs(angleinc)<Math.abs(endangle-angle))) {
circleGoing=true
angle += angleinc
var x = xcenter + radius*Math.cos(angle*Math.PI/180)
var y = ycenter - radius*Math.sin(angle*Math.PI/180)
for(i=1;i<oBut.length;i++){
//if angle are bigger then the stop angle of each button
if(angle>=oBut[i:u23hurx86z].stop) oBut[i:u23hurx86z].moveIt(x,y)
}
setTimeout("circleGo("+radius+","+angleinc+","+angle+","+endangle+","+xcenter+","+ycenter+",'"+fn+"')",circleSpeed)
}else{
circleGoing=false
eval(fn)
}
}
/************************************************** *************************
When click on the buttons
************************************************** **************************/
var zIndex=5
function mclick(num){
//If it's not moving already
if(!circleGoing){
//Added feature; the clicked buttons stays on top!
zIndex++
oBut[num].css.zIndex=zIndex
//Checks the state of the menu and circles it the right way
if(menuState) circleGo(radius,moveAngle,oBut[5].stop,startAngle+5,xcenter,ycenter,'moveCenter()')
else moveFromCenter()
}
}
//Moving the buttons to the center
function moveCenter(){
if(oBut[0].y<95){
for(i=0;i<oBut.length;i++){
oBut[i:u23hurx86z].moveIt(oBut[i:u23hurx86z].x+(i-2.5),oBut[i:u23hurx86z].y+3)
}
setTimeout("moveCenter()",30)
}else{
menuState=0
//HERE GOES CODE TO MAKE IT DO SOMETHING WHEN IT REACHES CENTER!
}
}
//Moving the buttons from center
function moveFromCenter(){
if(oBut[0].y>6){
for(i=0;i<oBut.length;i++){
oBut[i:u23hurx86z].moveIt(oBut[i:u23hurx86z].x-(i-2.5),oBut[i:u23hurx86z].y-3)
}
setTimeout("moveFromCenter()",30)
}else{
circleGo(radius,-moveAngle,startAngle,oBut[5].stop,xcenter,ycenter,'menuState=1')
}
}
/************************************************** *************************
Mouseover and out on the buttons
************************************************** **************************/
function mover(num){
oBut[num].ref["img"+num].src='http://www.1premal.f2s.com/1_1.gif'
}
function mout(num){
oBut[num].ref["img"+num].src='http://www.1premal.f2s.com/'+(num+1)+'.gif'
}
//Starting the menu on pageload.
onload=init;
</SCRIPT>
<META content="MSHTML 5.50.4207.2601" name=GENERATOR></HEAD>
<BODY>
<DIV id=divCont>
<DIV id=divCenter>http://www.1premal.f2s.com/circle.gif</DIV>
<DIV class=clButtons id=div0>http://www.1premal.f2s.com/1.gif (http://www.bratta.com/dhtml/demos/circlemenu/#)</DIV>
<DIV class=clButtons id=div1>http://www.1premal.f2s.com/2.gif (http://www.bratta.com/dhtml/demos/circlemenu/#)</DIV>
<DIV class=clButtons id=div2>http://www.1premal.f2s.com/3.gif (http://www.bratta.com/dhtml/demos/circlemenu/#)</DIV>
<DIV class=clButtons id=div3>http://www.1premal.f2s.com/4.gif (http://www.bratta.com/dhtml/demos/circlemenu/#)</DIV>
<DIV class=clButtons id=div4>http://www.1premal.f2s.com/5.gif (http://www.bratta.com/dhtml/demos/circlemenu/#)</DIV>
<DIV class=clButtons id=div5>http://www.1premal.f2s.com/6.gif (http://www.bratta.com/dhtml/demos/circlemenu/#)</DIV></DIV></BODY></HTML>