下午吃瓜时间到，快带嘴来！哈哈！
<html>
<head>
<title>仿Joyo网站菜单</title>
<script>
var t=setTimeout("null",50);
function $(ye){
ye=document.getElementById(ye);
return ye;
}
function padW(){
var p;
if($("cha").offsetWidth>$("ti").offsetWidth){
p=$("ti").offsetLeft-(($("cha").offsetWidth-$("ti").offsetWidth)/2);
}
else{
p=$("ti").offsetLeft+(($("ti").offsetWidth-$("cha").offsetWidth)/2);
}
return p;
}
function padH(){
var s;
s=$("ti").offsetTop+$("ti").offsetHeight-3;
return s;
}
function showDiv(){
$("cha").style.display='block';
}
function hideDiv(){
$("cha").style.display='none';
}
</script>
<script for=window event=onload>
var w=padW(),h=padH();
with($("cha")){
style.display='none';
style.pixelLeft=w;
style.pixelTop=h;
}
</script>
<style type="text/css">
#cha{
position:absolute;
width:300px;
left:-1000px;
top:-1000px;
border:2px solid #cccccc;
background:orange;FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=1,startColorStr=green,endColorStr=gold);
}
a:link{
text-decoration:none;
color:black;
font:normal small-caps bold 12px/140% "Lucida Grande",sans-serif;
}
a:visited{
text-decoration:none;
color:blue;
font:normal small-caps bold 12px/140% "Lucida Grande",sans-serif;
}
a:hover{
text-decoration:underline;
color:red;
font:normal small-caps bold 12px/140% "Lucida Grande",sans-serif;
}
#main{
position:absolute;left:250px;top:100px;
}
</style>
</head>
<body>
<div onmouseover=showDiv() onmouseout=hideDiv() style="border:1px solid red"
id=main>
<div id="cha" name="cha">
<table>
<tr><td><a href="http://www.it365cn.com">织梦乱弹</a></td><td
width="40"> </td><td><a href="http://www.smallrain.net">小雨</a></td></tr>
<tr><td><a href="http://yexj00.5dm.cn/">Yexj00's Blog</a></td><td
width="40"> </td><td><a href="http://www.W3pop.com">w3pop</a></td></tr>
<tr><td><a href="http://www.blueIdea.com">蓝色理想</a></td><td
width="40"> </td><td><a href="http://www.mysheji.com/blog/">设计前沿
</a></td></tr>
<tr><td><a href="http://www.cnbruce.com/">布鲁斯狼</a></td><td
width="40"> </td><td><a href="http://www.webjx.com/">网页教学</a></td></tr>
</table>
</div>
<span style="cursor:hand;" id="ti" onmouseover=showDiv() onmouseout="hideDiv()">
每天常去的网站</span><br>
</div>
</body>
</html>
<head>
<title>仿Joyo网站菜单</title>
<script>
var t=setTimeout("null",50);
function $(ye){
ye=document.getElementById(ye);
return ye;
}
function padW(){
var p;
if($("cha").offsetWidth>$("ti").offsetWidth){
p=$("ti").offsetLeft-(($("cha").offsetWidth-$("ti").offsetWidth)/2);
}
else{
p=$("ti").offsetLeft+(($("ti").offsetWidth-$("cha").offsetWidth)/2);
}
return p;
}
function padH(){
var s;
s=$("ti").offsetTop+$("ti").offsetHeight-3;
return s;
}
function showDiv(){
$("cha").style.display='block';
}
function hideDiv(){
$("cha").style.display='none';
}
</script>
<script for=window event=onload>
var w=padW(),h=padH();
with($("cha")){
style.display='none';
style.pixelLeft=w;
style.pixelTop=h;
}
</script>
<style type="text/css">
#cha{
position:absolute;
width:300px;
left:-1000px;
top:-1000px;
border:2px solid #cccccc;
background:orange;FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=1,startColorStr=green,endColorStr=gold);
}
a:link{
text-decoration:none;
color:black;
font:normal small-caps bold 12px/140% "Lucida Grande",sans-serif;
}
a:visited{
text-decoration:none;
color:blue;
font:normal small-caps bold 12px/140% "Lucida Grande",sans-serif;
}
a:hover{
text-decoration:underline;
color:red;
font:normal small-caps bold 12px/140% "Lucida Grande",sans-serif;
}
#main{
position:absolute;left:250px;top:100px;
}
</style>
</head>
<body>
<div onmouseover=showDiv() onmouseout=hideDiv() style="border:1px solid red"
id=main>
<div id="cha" name="cha">
<table>
<tr><td><a href="http://www.it365cn.com">织梦乱弹</a></td><td
width="40"> </td><td><a href="http://www.smallrain.net">小雨</a></td></tr>
<tr><td><a href="http://yexj00.5dm.cn/">Yexj00's Blog</a></td><td
width="40"> </td><td><a href="http://www.W3pop.com">w3pop</a></td></tr>
<tr><td><a href="http://www.blueIdea.com">蓝色理想</a></td><td
width="40"> </td><td><a href="http://www.mysheji.com/blog/">设计前沿
</a></td></tr>
<tr><td><a href="http://www.cnbruce.com/">布鲁斯狼</a></td><td
width="40"> </td><td><a href="http://www.webjx.com/">网页教学</a></td></tr>
</table>
</div>
<span style="cursor:hand;" id="ti" onmouseover=showDiv() onmouseout="hideDiv()">
每天常去的网站</span><br>
</div>
</body>
</html>
本文来自Memory's Blog
