看晕了!

bonniewater 2003-05-26 05:44:16
<style>
.sml_menu {font-size: 9pt; color: white; cursor: hand; font-family: Tahoma;}
.font3 {font-size: 10.5pt; color: 147e19; font-family: Courier New;}
.menuitem {font-size: 10.5pt; color: white; cursor: default; font-family: Courier New;}
</style>
<script language="javascript">
var intDelay=50;
var intInterval=5;
function MenuClick()
{
if (LayerMenu.style.display=="")
{
LayerMenu.style.display="none";
}
else{
LayerMenu.filters.alpha.opacity=0;
LayerMenu.style.display="";
GradientShow();
}
}

function GradientShow()
{
LayerMenu.filters.alpha.opacity+=intInterval;
if (LayerMenu.filters.alpha.opacity<100) setTimeout("GradientShow()",intDelay);
}

function GradientClose()
{
LayerMenu.filters.alpha.opacity-=intInterval;
if (LayerMenu.filters.alpha.opacity>0) {
setTimeout("GradientClose()",intDelay);
}
else {
LayerMenu.style.display="none";
}
}

function ChangeBG()
{
oEl=event.srcElement;
if (oEl.style.background!="navy") {
oEl.style.background="navy";
}
else {
oEl.style.background="#147e19";
}
}

function ItemClick()
{
oEl=event.srcElement;
oLink=oEl.all.tags( "A" );
if( oLink.length )
{
oLink[0].click();
GradientClose();
}
}
</script>
</head>
<body onMouseover="GradientClose();">
<br>

<div style="Position:Absolute;Left:250px;Top:120px;" onClick="MenuClick()">
<table border=0 cellpadding=0 cellspacing=0 width=300><tr><td bgcolor=#147e19 class=sml_menu height=20 onselectstart="return false;"> Click here to show the menu ... (单击显示菜单)</td></tr></table>
</div>

</body>

<div id=LayerMenu style="Position:Absolute;Left:250px;Top:137px;Display:none;filter:alpha(opacity=0);" oncontextmenu="return false" onMouseover="window.event.cancelBubble = true;">

<table border=0 cellpadding=0 cellspacing=0 bgcolor=147e19>
<tr><td height=1 bgcolor=#f0f0f0 colspan=2></td></tr>
<tr><td width=20 valign=bottom bgcolor=navy></td>
<td>
<table border=0 width=200 cellpadding=0 cellspacing=0 onselectstart="return false;" onclick="ItemClick();" onMouseover="ChangeBG();" onMouseout="ChangeBG();">
<tr><td class=menuitem height=20 style="background: 147e19;"><a href=/First></a>1.The First Menu Item</td></tr>
<tr><td class=menuitem height=20 style="background: 147e19;"><a href=/Second></a>2.The Second Menu Item</td></tr>
<tr><td class=menuitem height=20 style="background: 147e19;">3.The Third Menu Item</td></tr>
<tr><td class=menuitem height=20 style="background: 147e19;">4.The Fourth Menu Item</td></tr>
</table>
</td></tr>
</table>
</div>

</html>
这是个淡入淡出的菜单,基本上看晕了,大虾给解释一下吧,多谢了!
...全文
74 13 打赏 收藏 转发到动态 举报
写回复
用AI写文章
13 条回复
切换为时间正序
请发表友善的回复…
发表回复
bonniewater 2003-05-28
  • 打赏
  • 举报
回复
多谢了!
boy21cnthp 2003-05-27
  • 打赏
  • 举报
回复
再详细点好吗
nhconch 2003-05-27
  • 打赏
  • 举报
回复
先到这里下个教程看看,讲坛只能不一搭没一搭的,不如自己看书:
http://bjxebook.myetang.com/down/pc/javascripttut.html
bonniewater 2003-05-27
  • 打赏
  • 举报
回复
还不是很明白,主要window不是对象吗?
操作对象,不是只能有属性和方法吗?
怎么又出来事件了?
nhconch 2003-05-27
  • 打赏
  • 举报
回复
就是事件呀
http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/objects/obj_event.asp
bonniewater 2003-05-27
  • 打赏
  • 举报
回复
window.event这个用的比较多,能说说吗?
哦,这方面的教程在哪能找到呀?
您真是一个好人!
nhconch 2003-05-27
  • 打赏
  • 举报
回复
javascript调用style.display、filters.alpha.opacity是为了读取、改变它们的值
这些属性是元件style.display、value是元件自身有的,过滤器有很多种,你得声明使用那种。
nhconch 2003-05-27
  • 打赏
  • 举报
回复
<div id=LayerMenu
   ^层的ID值

style="Position:Absolute;Left:250px;Top:137px;Display:none;filter:alpha(opacity=0);" oncontextmenu="return false"
^css样式:
Position:Absolute  <-使用绝对位置
Left:250px;Top:137px <-位置的x、y坐标
Display:none     <-不显示,即隐藏
filter:alpha(opacity=0)<-使用alpha过滤器,opacity=0完全透明

onMouseover="window.event.cancelBubble = true;">
^鼠标移到上面时执行window.event.cancelBubble = true;
              ^把事件冒泡给父对象
bonniewater 2003-05-27
  • 打赏
  • 举报
回复
就是我定义的层了?
那么层的例如“style.display”“filters.alpha.opacity”这些属性是不是也是自己定义的?
例如“theform.aa.value”?
谢谢您,别嫌烦,麻烦了!
nhconch 2003-05-27
  • 打赏
  • 举报
回复
<div id=LayerMenu .....> //<--LayerMenu是你定义的块
bonniewater 2003-05-27
  • 打赏
  • 举报
回复
LayerMenu是js自带的对象吗?
可以直接用它的一些属性和方法?
nhconch 2003-05-26
  • 打赏
  • 举报
回复
还有这个
function MenuClick()
{
if (LayerMenu.style.display=="")
{
LayerMenu.style.display="none"; //不显示
}
else{
LayerMenu.filters.alpha.opacity=0;
LayerMenu.style.display=""; //这个跟LayerMenu.style.display="block"; 作用一样,把LayerMenu显示出来,不过此时的filters.alpha.opacity为0(完全透明)
GradientShow(); //所以调用GradientShow(); 把它渐显出来。
}
}


function ChangeBG() 用来改变背景色

其它还要解释吗
nhconch 2003-05-26
  • 打赏
  • 举报
回复
style="Position:Absolute;Left:250px;Top:137px;Display:none;filter:alpha(opacity=0);"
用了alpha过滤器,初始时opacity=0,就是完全透明

function GradientShow()
{
LayerMenu.filters.alpha.opacity+=intInterval;
if (LayerMenu.filters.alpha.opacity<100) setTimeout("GradientShow()",intDelay);
}
不断加大opacity值,直至100%,不透明

function GradientClose()
{
LayerMenu.filters.alpha.opacity-=intInterval;
if (LayerMenu.filters.alpha.opacity>0) {
setTimeout("GradientClose()",intDelay);
}
else {
LayerMenu.style.display="none";
}
}
不断减少opacity值,到0时style.display="none"; 隐藏了。

87,988

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧