<style type="text/css">
<!--
.style1 {
color: #0000FF;
font-size: 16px;
font-family: "黑体";
}
.style2 {
color: #FF0000;
font-size: 12px;
}
.style3 {
color: #663300;
font-size: 12px;
}
.catnav {
position:absolute;
top:400px;
margin:10px;
clear:left;
}.catnav a {
background:#FFFFFF;
float:left;
margin:5px 1px 0 1px;
width:20px;
height:20px;
color:#999;
font:12px/20px 宋体;
text-align:center;
text-decoration:none;
border:1px solid orange;
}
.catnav a span {
background:#000000;
color:#FFFFFF;
width:300px;
padding:5px;
border:1px red solid;
display:block;
visibility:hidden;
position:absolute;
left:100px;
}
.catnav a:hover {
background:#000000;
color:#FFFFFF;
position:relative;
border:1px solid orange;
margin:0 -9px 0 -9px;
padding:0 5px;
width:30px;
height:30px;
font:bold 16px/30px 宋体;
}
.catnav a:hover span{
visibility:visible;
}
.circle { font-family: Verdana, Helvetica; font-size: 12px; color: #000000; position:
absolute; visibility: hidden; z-index: 2 }
.text { text-align: left; font-family: Verdana, Helvetica; font-size: 12px; color:
#000000; position: absolute; top: 185px; left: 280px; width:
225px; visibility: hidden; z-index: 0 }
.picture { font-family: Verdana, Helvetica; font-size: 12px; color: #000000; position:
absolute; top: 10px; left: 10px; visibility: visible; z-index:
1 }
-->
</style></head><body bgcolor="#ffffcc">
<div align="center">
<table border="0" cellpadding="0" cellspacing="0" width="730">
<!--DWLayoutTable-->
<tbody>
<tr>
<td width="730" height="462" valign="top"><div align="center">
<script language="JavaScript">
<!--
function showObject(object) {
object.visibility = VISIBLE;
}
function hideObject(object) {
object.visibility = HIDDEN;
}
function slidepicture(from, to) {
if (from < to) {
website.top = (from += 10);
setTimeout('slidepicture(' + from + ',' + to + ')', 75);
}
else initObjects();
}
function rotateObjects() {
for (var i = 0; i < pos.length; i++) {
pos[i] += inc; objects[i].visibility = 'visible';
objects[i].left = (r * Math.cos(pos[i])) + xoff
objects[i].top = (r * Math.sin(pos[i])) + yoff;
}
rotateTimer = setTimeout("rotateObjects()", 75);
}
function initObjects() {
objects = new Array(circle1, circle2, circle3, circle4, circle5, circle6);
pos = new Array();
pos[0] = 0;
for (var i = 1; i < objects.length; i++) {
pos[i] = parseFloat(pos[i - 1] + ((2 * pi) / objects.length));
}
rotateObjects();
}
// Variables for rotating images/text //
var objects;
var pos;
var r = 150; // radius
var xoff = 340; // horizontal position
var yoff = 230; // vertical position
var pi = Math.PI;
var inc = pi / 180; // the higher the pi the slower the speed of rotation
var objects;
var pos;
//-->
</script>
</div> <div style="visibility: visible; left: 239.63px; top: 341.472px;" id="circle1" class="circle">
<div align="center"><a href="#" onMouseOver="showObject(text1)" onMouseOut="hideObject(text1)">鼠标移到这里</a><br>
</div>
</div> <div style="visibility: visible; left: 193.278px; top: 198.813px;" id="circle2" class="circle">
<div align="center"><a href="#" onMouseOver="showObject(text2)" onMouseOut="hideObject(text2)">也可以是图片</a><br>
</div>
</div> <div style="visibility: visible; left: 293.647px; top: 87.3415px;" id="circle3" class="circle">
<div align="center"><a href="http://www.jzxue.com/Html/sheji/" onMouseOver="showObject(text3)" onMouseOut="hideObject(text3)">动态导航</a><br>
</div>
</div> <div style="visibility: visible; left: 440.37px; top: 118.528px;" id="circle4" class="circle">
<div align="center"><a href="http://www.jzxue.com/Html/sheji/" onMouseOver="showObject(text4)" onMouseOut="hideObject(text4)">DHTML</a></div>
</div> <div style="visibility: visible; left: 486.722px; top: 261.187px;" id="circle5" class="circle">
<div align="center"><a href="http://www.jzxue.com/Html/sheji/" onMouseOver="showObject(text5)" onMouseOut="hideObject(text5)">下一个</a><br>
</div>
</div> <div style="visibility: visible; left: 386.353px; top: 372.658px;" id="circle6" class="circle">
<div align="center"><a href="http://www.jzxue.com/Html/sheji/" onMouseOver="showObject(text6)" onMouseOut="hideObject(text6)">上一个</a><br>
</div>
</div> <div id="website" class="picture">
</div> <div style="visibility: hidden;" id="text1" class="text">
<p align="center">建站学-网页制作学习</div> <div style="visibility: hidden;" id="text2" class="text">
<p align="center">建站学-网页制作学习</div> <div style="visibility: hidden;" id="text3" class="text">
<p align="center">建站学-网页制作学习</div> <div style="visibility: hidden;" id="text4" class="text">
<p align="center">建站学-网页制作学习
</div> <div style="visibility: hidden;" id="text5" class="text">
<p align="center">建站学-网页制作学习</div> <div id="text6" class="text">
<p align="center">建站学-网页制作学习</div> <div align="center">
<script language="JavaScript">
var isNS = (navigator.appName == "Netscape" && parseInt(navigator.appVersion) >=100);
var HIDDEN = (isNS) ? 'hide' : 'hidden';
var VISIBLE = (isNS) ? 'show' : 'visible';
var circle1 = (isNS) ? document.circle1 : document.all.circle1.style;
var circle2 = (isNS) ? document.circle2 : document.all.circle2.style;
var circle3 = (isNS) ? document.circle3 : document.all.circle3.style;
var circle4 = (isNS) ? document.circle4 : document.all.circle4.style;
var circle5 = (isNS) ? document.circle5 : document.all.circle5.style;
var circle6 = (isNS) ? document.circle6 : document.all.circle6.style;
var website = (isNS) ? document.website : document.all.website.style;
var text1 = (isNS) ? document.text1 : document.all.text1.style;
var text2 = (isNS) ? document.text2 : document.all.text2.style;
var text3 = (isNS) ? document.text3 : document.all.text3.style;
var text4 = (isNS) ? document.text4 : document.all.text4.style;
var text5 = (isNS) ? document.text5 : document.all.text5.style;
var text6 = (isNS) ? document.text6 : document.all.text6.style;
slidepicture(1000, 10);
</script>
</div></td>
</tr>
</tbody></table>
</div>
效果演示:
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
|
