干脆用flash更简单，至少代码要少很多了
解决方案 »
- jquery.bubblepopup.v2.3.1包
- iframe父页面怎么获取子窗口的对象
- JS中这几个方法是什么意思？
- 如何用JS实现点击栏目列表的标题，在其下面出现应该栏目标题的详细内容（如点击专业列表，在页面中显示其专业的详细内容介绍）
- 如何一次外部包含引入多个js,css文件呢
- 现把数据存到javascript数组中，如何用javascript实现这些数据在客户端的分页?
- 紧急求救，来者有分(以后加上，100分）！
- 请给我JAVASCRIPT的所有属性和内部函数
- 关掉IE后弹出一个窗口，相当于alert小窗口，怎么实现？
- 如何用代码控制IE弹出的警告窗口？急！！！
- left,pixelLeft,posLeft属性的问题，高手进来答疑，给高分！！！！！！
- 怎么控制网页背景音乐，用一个按纽控制他的播放和停止，
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<STYLE TYPE="text/css" TITLE="">
<!--
#menu{ /*装载菜单的层的样式*/
position:absolute;
visibility:hidden;
width:100px;
border:2 solid #3399ff;
text-align:center;
background:#3399ff;
filter:alpha(Opacity=80, Finishopacity=0, Style=1, StartX=0, FinishX=0, StartY=0, FinishY=0);
z-index:100;
}
.menuItem{ /*菜单项目的一般样式*/
position:relative;
width:100%;
font:bold 10pt;
line-height:1.3em;
color:#ffffff;
}
.highLightMenu{ /*鼠标在菜单项时高亮显示菜单项目的样式*/
font:bold 10pt;
line-height:1.3em;
color:#3399ff;
background:white;
cursor:hand;
}
.disableMenu{ /*失效的菜单项目*/
font:bold 10pt;
line-height:1.3em;
color:#D4D4D4;
cursor:default;
}
-->
</STYLE>
</head><body>
单击鼠标右键显示菜单！
<script language="JavaScript">
<!--
var lineStr="<HR size=\"1\" color=\"white\" noshade>";
var menuStr="<DIV id=\"menu\">";
menuStr+="<DIV class=\"menuItem\" onClick=\"javascript:window.external.addFavorite('http://www.zhezhile.net.tc/','·：：折纸乐：：·')\" onMouseOver=\"javascript:status='点击将折纸乐加入您的收藏夹！';return true;\" onMouseOut=\"javascript:status='';return true;\">加入收藏夹</DIV>";
menuStr+="<DIV class=\"menuItem\" onClick=\"this.style.behavior='url(#default#homepage)';this.sethomepage('http://www.zhezhile.net.tc')\" onMouseOver=\"javascript:status='点击将折纸乐设为IE浏览器的首页！';return true;\" onMouseOut=\"javascript:status='';return true;\">设为首页</DIV>";
menuStr+=lineStr;
menuStr+="<DIV name=\"index\" class=\"menuItem\" onClick=\"javascript:location.href='index.htm'\" onMouseOver=\"javascript:status='点击到折纸乐首页！';return true;\" onMouseOut=\"javascript:status='';return true;\">首页</DIV>";
menuStr+="<DIV name=\"aboutus\" class=\"menuItem\" onClick=\"javascript:location.href='aboutus.htm'\" onMouseOver=\"javascript:status='如果想进一步了解折纸乐是必到之处啊！';return true;\" onMouseOut=\"javascript:status='';return true;\">关于我们</DIV>";
menuStr+="<DIV name=\"assortiment\" class=\"menuItem\" onClick=\"javascript:location.href='assortiment.htm'\" onMouseOver=\"javascript:status='折纸乐的折纸库，折纸乐的所有折纸都在里面了！';return true;\" onMouseOut=\"javascript:status='';return true;\">折纸分类</DIV>"
menuStr+="<DIV name=\"correlation\" class=\"menuItem\" onClick=\"javascript:location.href='correlation.htm'\" onMouseOver=\"javascript:status='有关折纸的知识、新闻、书籍等介绍！';return true;\" onMouseOut=\"javascript:status='';return true;\">折纸相关</DIV>";
menuStr+="<DIV name=\"gather\" class=\"menuItem\" onClick=\"javascript:location.href='gather.htm'\" onMouseOver=\"javascript:status='向折纸乐推荐您懂得的折纸，展示您的能力！';return true;\" onMouseOut=\"javascript:status='';return true;\">折纸征集</DIV>";
menuStr+="<DIV name=\"message\" class=\"menuItem\" onClick=\"javascript:location.href='message.htm'\" onMouseOver=\"javascript:status='有什么想跟我说的吗，不要犹豫了，进来给我留言吧！';return true;\" onMouseOut=\"javascript:status='';return true;\">折留乐言</DIV>";
menuStr+="<DIV name=\"relation\" class=\"menuItem\" onClick=\"javascript:location.href='relation.htm'\" onMouseOver=\"javascript:status='您有什么需要与我联系吗，里面有我的联系信息呢！';return true;\" onMouseOut=\"javascript:status='';return true;\">与我联系</DIV>";
menuStr+="<DIV name=\"sibling\" class=\"menuItem\" onClick=\"javascript:location.href='sibling.htm'\" onMouseOver=\"vavascript:status='我为您找到了很多折纸网站，去看看吧！';return true;\" onMouseOut=\"javascript:status='';return true;\">相关网站</DIV>";
menuStr+=lineStr;
menuStr+="<DIV class=\"menuItem\" onClick=\"javascript:location.href='mailto:[email protected]'\" onMouseOver=\"javascript:status='给我写信发表您对折纸乐的宝贵意见吧！';return true;\" onMouseOut=\"javascript:status='';return true;\">发表意见</DIV>";
menuStr+="<DIV name=\"copyright\" class=\"menuItem\" onClick=\"javascript:location.href='copyright.htm'\" onMouseOver=\"status='对于”折纸乐“发表在Internet方面的版权声明！';return true;\" onMouseOut=\"javascript:status='';return true;\">版权声明</DIV>";
menuStr+=lineStr;
menuStr+="<DIV class=\"menuItem\" onClick=\"window.location='view-source:'+window.location.href\" onMouseOver=\"status='查看本页的HTML源代码！';return true;\" onMouseOut=\"javascript:status='';return true;\">查看源代码</DIV>";
menuStr+="<DIV id=\"saveAs\" class=\"menuItem\" onMouseOut=\"javascript:status='';return true;\">图片另存为</DIV>";
menuStr+="</DIV>";
document.write(menuStr);//全局变量function overMenu(){ //鼠标进入菜单项目时改变该项目的样式
if(event.srcElement.className=="menuItem")
event.srcElement.className="highLightMenu";
}
menu.onmouseover=overMenu;
function outMenu(){ //鼠标离开菜单项目时改变该项目的样式
if(event.srcElement.className=="highLightMenu")
event.srcElement.className="menuItem";
}
menu.onmouseout=outMenu;function showMenu(){ //定位菜单及显示 for (var i=0;i<menu.all.length;i++) //找出是否已经在当前页面
{
var menuItem=menu.all[i];
if(location.href.indexOf(menuItem.name)!=-1){ //判断是否当前页
menuItem.className="disableMenu"
menuItem.unselectable="on"; //不能选择文字（IE5.5+）
menuItem.onmouseover=function statusInfo(){return status="您正处于本页中，不需要再链接了，请选择其它你需要的吧！";};
menuItem.onclick="";
menuItem.title="请选择其它你需要的吧！";
}
} //获得鼠标到网页的右边和底部的距离
var rightWidth=document.body.clientWidth-event.clientX;
var bottomHeight=document.body.clientHeight-event.clientY; //定位菜单层
//document.body.scrollLeft|Top是网页显示区域的左上角处于网页的坐标位置
//document.body.clientWidth|Height是网页的显示区域
if(rightWidth<menu.offsetWidth)
menu.style.left=document.body.scrollLeft +event.clientX -menu.offsetWidth
else menu.style.left=document.body.scrollLeft +event.clientX;
if(bottomHeight<menu.offsetHeight)
if(event.clientY<menu.offsetHeight)
menu.style.top=document.body.scrollTop +document.body.clientHeight -menu.offsetHeight
else menu.style.top=document.body.scrollTop +event.clientY -menu.offsetHeight
else menu.style.top=document.body.scrollTop +event.clientY; menu.style.visibility="visible"; //显示菜单层 if(bottomHeight<menu.offsetHeight) bottomToUp(100,90,5);
else upToBottom(0,10,5);
function bottomToUp(start,finish,speed){ //由底至上显示
menu.filters.alpha.startY=start;
menu.filters.alpha.finishY=finish;
function menuShowEffect(){
start-=speed;
finish-=speed++;
menu.filters.alpha.startY=start;
menu.filters.alpha.finishY=finish;
if(start<=0){
menu.filters.alpha.startY=1;
menu.filters.alpha.finishY=0;
clearInterval(cycID);
}
}
cycID=setInterval(menuShowEffect,1);
}
function upToBottom(start,finish,speed){ //由上至下显示
menu.filters.alpha.startY=start;
menu.filters.alpha.finishY=finish;
function menuShowEffect(){
start+=speed;
finish+=speed++;
menu.filters.alpha.startY=start;
menu.filters.alpha.finishY=finish;
if(start>=100){
menu.filters.alpha.startY=99;
menu.filters.alpha.finishY=100;
clearInterval(cycID);
}
}
cycID=setInterval(menuShowEffect,1);
} return false; //返回false值以取消原来的右键菜单
}function hideMenu(){ //隐藏菜单层
menu.style.visibility="hidden";
}document.oncontextmenu=showMenu; //捕捉鼠标右键事件
document.body.onclick=hideMenu; //点击菜单以外的地方隐藏菜单
//-->
</script>
</body>
</html>
实现这个效果后，我还实现了用鼠标拖动层，但是拖动的时候，鼠标点击层的任何位置都能拖动，我想只让它在点击层的某个位置（比如说头部）的时候才能拖动，不知道如何实现
function bottomToUp(start,finish,speed){ //由底至上
menu.filters.alpha.startY=start;
menu.filters.alpha.finishY=finish;
function menuShowEffect(){
start-=speed;
finish-=speed++;
menu.filters.alpha.startY=start;
menu.filters.alpha.finishY=finish;
if(start<=0){
menu.filters.alpha.startY=0;
menu.filters.alpha.finishY=1;
clearInterval(cycID);
menu.style.visibility="hidden";
}
}
cycID=setInterval(menuShowEffect,1);
}
bottomToUp(90,100,5）；
}