功能强大的旋转领航文字圈 _Web前端

功能强大的旋转导航文字圈
<body>
<style type="text/css"> 
BODY 
{ 
background : #efefef; 
font : 12px Verdana; 
} 
A { color : #e70 } 
A:hover { text-decoration : none } 
.spin 
{ 
position : absolute; 
visibility : hidden; 
z-index : auto; 
} 
.spin A 
{ 
font : 12px Verdana; 
text-decoration : none; 
} 
.spin A:hover 
{ 
text-decoration : underline overline; 
} 
</style> 
<script language="JavaScript1.2">
function getPageSize()
{
	this.x = document.getElementsByTagName('html').item(0).clientWidth||document.getElementsByTagName('html').item(0).offsetWidth||document.body.offsetWidth||innerWidth
	this.y = document.getElementsByTagName('html').item(0).clientHeight||document.getElementsByTagName('html').item(0).offsetHeight||document.body.offsetHeight||innerHeight
	this.x2 = parseInt(this.x/2)||0
	this.y2 = parseInt(this.y/2)||0
	this.sx = document.body.scrollWidth||0
	this.sy = document.body.scrollHeight||0
}
var pg
var pi = 3.1415
function spinMenu(cls,rad,eSpd,rSpd,dir,x,y,noCt,runEx)
{
	pg = new getPageSize()
	this.cls = cls
	this.rad = rad
	this.eSpd = eSpd
	this.rSpd = rSpd
	this.dir = dir ? 1 : -1
	this.x = x<0 ? pg.x2 : x
	this.y = y<0 ? pg.y2 : y
	this.runEx = runEx||0
	this.noCt = noCt||0
	this.r = 0 // radius flux
	this.ex = 0 // expand timeout
	this.ct = 0 // contract timeout
	this.rt = 1 // rotate timeout
	this.vis = 0 // visibility
	this.rNum = 0 // rotational flux
	this.rSpd2 = 0 // rSpd holder
	this.exDone = 0 // expand complete?
	this.ctDone = 1 // contract complete?
	this.toFig = 0
	this.atX = 0
	this.atY = 0
	this.url = 0
	this.target = 0
	eval(this.obj + "=this")
	this.items = new Array()
	this.el = document.getElementsByTagName('div')
	for(i=0;(this.el.item(i));i++)
	{
		if(this.el.item(i).className==this.cls)
		{
			this.el.item(i).onmouseover = new Function(this.obj+'.stop()')
			this.el.item(i).onmouseout = new Function(this.obj+'.rotate()')
			this.el.item(i).onclick = new Function(this.obj+'.contract()')
			this.items[this.items.length] = this.el.item(i)
		}
	}
	delete this.el
	for(i=0;(this.items[i]);i++)
	{
		if(!this.items[i].childNodes.item(0).nodeValue)
		{
			this.items[i].childNodes.item(0).onmouseover = new Function('status=this.href;return true')
			this.items[i].childNodes.item(0).onmouseout = new Function('status=\'\';return true')
			this.items[i].childNodes.item(0).onclick = new Function(this.obj+'.setURL(this.href,this.target);return false')
			this.items[i].childNodes.item(0).onfocus = new Function('this.blur()')
		}
	}
	return this
}
spinMenu.prototype.init = function()
{
	this.hide()
	this.place()
	this.expand()
}
spinMenu.prototype.rotate = function()
{
	if(this.rSpd)
	{
		this.rNum += pi/(1000/this.rSpd)*this.dir
		if(this.exDone)
		{
			this.place()
			clearTimeout(this.rt)
			this.rt = setTimeout(this.obj+'.rotate()',20)
		}
	}
}
spinMenu.prototype.stop = function()
{
	clearTimeout(this.rt)
	this.rt = 0
}
spinMenu.prototype.expand = function()
{
	if(this.exDone!=1)
	{
		this.ctDone=0
		if(!this.vis) this.show()
		if(this.runEx) eval(this.runEx)
		if(this.ct!=0)
		{
			clearTimeout(this.ct)
			this.ct = 0
		}
		if(this.r<this.rad)
		{
			this.r += this.eSpd
			if(this.rSpd2==0) this.rSpd2 = this.rSpd
			this.rSpd = this.eSpd*3
			this.rotate()
			this.place()
			this.ex = setTimeout(this.obj+'.expand()',10)
		}
		else
		{
			this.ex = 0
			this.rSpd = this.rSpd2
			this.rSpd2 = 0
			this.ctDone = 0
			this.exDone = 1
			this.rotate()
		}
	}
}
spinMenu.prototype.contract = function()
{
	if(this.ctDone!=1&&!this.noCt)
	{
		this.exDone = 0
		if(this.ex!=0)
		{
			clearTimeout(this.ex)
			this.ex = 0
		}
		if(this.r>0)
		{
			this.r -= this.eSpd
			if(this.rSpd2==0) this.rSpd2 = this.rSpd
			this.rSpd = this.eSpd
			this.rotate()
			this.place()
			this.ct = setTimeout(this.obj+'.contract()',10)
		}
		else
		{
			this.rSpd = this.rSpd2
			this.rSpd2 = 0
			this.rNum = 0
			this.stop()
			this.hide()
			this.exDone = 0
			this.ctDone = 1
			this.goURL()
		}
	}
	else this.goURL()
}
spinMenu.prototype.place = function()
{
	for(i=0;(this.items[i]);i++)
	{
		this.atPt(i)
		this.items[i].style.left = this.atX-(this.items[i].offsetWidth/2)+'px'
		this.items[i].style.top = this.atY-(this.items[i].offsetHeight/2)+'px'
	}
}
spinMenu.prototype.atPt = function(pt)
{
	this.toFig = pi/(this.items.length/2)*(pt+this.rNum)
	this.atX = parseInt(Math.cos(this.toFig)*this.r+this.x)
	this.atY = parseInt(Math.sin(this.toFig)*this.r+this.y)
}
spinMenu.prototype.show = function()
{
	for(i=0;(this.items[i]);i++)
	{
		this.items[i].style.display = 'block'
		this.items[i].style.visibility = 'visible'
		this.vis = 1
	}
}
spinMenu.prototype.hide = function()
{
	for(i=0;(this.items[i]);i++)
	{
		this.items[i].style.visibility = 'hidden'
		this.items[i].style.display = 'none'
		this.vis = 0
	}
}
spinMenu.prototype.changeDir = function()
{
	this.dir = this.dir==1 ? -1 : 1
}
spinMenu.prototype.setURL = function(url,target)
{
	this.url = url
	this.target = target
}
spinMenu.prototype.goURL = function()
{
	if(this.url)
	{
		if(!this.target)
			if(document.getElementsByTagName('base').length) this.target = document.getElementsByTagName('base').item(0).target
		if(this.target)
		{
			if(this.target=='_blank') open(this.url)
			else if(this.target=='_parent') parent.location = this.url
			else if(this.target=='_top') top.location = this.url
			else if(this.target.indexOf('_')<0)
			{
				if(eval('parent.'+this.target)) eval('parent.'+this.target+'.document.location=this.url')
				else if(eval('top.'+this.target)) eval('top.'+this.target+'.document.location=this.url')
				else open(this.url,this.target)
			}
			else location = this.url
		}
		else location = this.url
		this.url = 0
	}
}
</script> 
<script language="JavaScript1.2" type="text/javascript"> 
function centerIt() 
{ 
pg = new getPageSize() 
menu.x = pg.x2-10 
menu.y = pg.y2 
} 
function initSpinMenu() 
{ 
menu = new spinMenu( 
'spin', // className 
120, // radius 
12, // expand/contract speed 
3, // rotational speed 
1, // direction (cw=1,ccw=0) 
-1, // origin x 
-1, // origin y 
0, // stay expanded? 
0 // run before expand 
) 
menu.init() 
} 
onload=initSpinMenu 
onresize=centerIt 
</script> 
<base target="newWin"> 
<div align="right"><a href="javascript:menu.expand()" target="_self">展开</a> | <a href="javascript:menu.contract()" target="_self">隐藏</a> | <a href="javascript:menu.stop()" target="_self">停止</a> | <a href="javascript:menu.rotate()" target="_self">旋转</a> | <a href="javascript:menu.changeDir()" target="_self">改变旋转方向</a></div> 
<div class="spin"><a href="http://www.butong.net">网页特效库</a></div> 
<div class="spin"><a href="http://www.butong.net/background/index.htm">背景特效</a></div> 
<div class="spin"><a href="http://www.butong.net/moban/index.htm">整站模板</a></div> 
<div class="spin"><a href="http://www.butong.net/navigation/index.htm">导航特效</a></div> 
<div class="spin"><a href="http://www.butong.net/time/index.htm">时间特效</a></div> 
<div class="spin"><a href="http://www.butong.net/img/index.htm">图象特效</a></div> 
<div class="spin"><a href="http://www.butong.net/text/index.htm">文本特效</a></div> </body>