一般OA左边的那种动画效果的下拉是怎么做的,求一思路即可~~
如题 问题点数:20、回复次数:7Top
1 楼superdullwolf(超级大笨狼,每天要自强,MVP)回复于 2004-08-01 09:55:10 得分 0
文件一框架sys_frames.asp
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>数据采集系统</title>
</head>
<frameset rows="94,*" cols="*" frameborder="NO" border="0" framespacing="0" >
<frame name="frmTop" src="sys_top.asp" scrolling="NO" noresize >
<frameset cols="169,10,*" frameborder="no" border="0" framespacing="0" id="frm">
<frame name="frmLeft" src="sys_left.asp" scrolling="NO" >
<frame name="frmControl" src="sys_frmControl.asp" scrolling="0" noresize marginheight="0" marginwidth="0">
<frame name="frmMain" src="input_fei_patient.asp" >
</frameset>
</frameset>
<noframes><body>
</body></noframes>
</html>
Top
2 楼superdullwolf(超级大笨狼,每天要自强,MVP)回复于 2004-08-01 09:55:42 得分 0
sys_left.asp
<head>
<STYLE>
.a{display:none;}
.b{display:block;}
.c{cursor:hand;}
.d{ FILTER: progid:DXImageTransform.Microsoft.Shadow(color=#333333,strength=2,direction=135); }
body,td,th
{
font-size: 12px;
}
body
{ backgrond-color:#F0F0FA;
margin-left: 2px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
overflow:hidden;
}
</STYLE>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"></head>
<body >
<table width="167" height="99%" border =1 align="left" cellpadding="0" cellspacing="0" bordercolor="#c2c2d5" id="tb" style=" border-collapse:collapse;">
<tr class="c" onclick="aaa(this);">
<td height="28" align="center" valign="middle" background="images/bg4.gif" >
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr align="center">
<td><img src="images/dot1.gif" width="8" height="8"></td>
<td><font color="#000000">费用查询</font></td>
<td><img src="images/dot.gif" width="8" height="8"></td>
</tr>
</table>
</td>
</tr>
<tr class="b" >
<td align="center" valign="top"> <table width="64" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td align="center"><br> <img src="images/2.gif" width="32" height="32" onmouseover="this.className='d'" onmouseout="this.className='b'" onClick="window.parent.frames('frmmain').location.href='input_fei_patient.asp'"></td>
</tr>
<tr>
<td align="center">病人费用 </td>
</tr>
<tr>
<td align="center"><br> <img src="images/1.gif" width="32" height="32" onmouseover="this.className='d'" onmouseout="this.className='b'" onClick="window.parent.frames('frmmain').location.href='input_fei_Item.asp'"></td>
</tr>
<tr>
<td align="center">项目查询</td>
</tr>
<tr>
<td align="center"><br> <img src="images/3.gif" width="32" height="32" onmouseover="this.className='d'" onmouseout="this.className='b'" onClick="window.parent.frames('frmmain').location.href='input_fei_Target.asp'"></td>
</tr>
<tr>
<td align="center">费用指标</td>
</tr>
</table></td>
</tr>
<tr class="c" onclick="aaa(this);">
<td height="28" align="center" background="images/bg4.gif">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr align="center">
<td><img src="images/dot1.gif" width="8" height="8"></td>
<td><font color="#000000">其他功能</font></td>
<td><img src="images/dot.gif" width="8" height="8"></td>
</tr>
</table>
</td>
</tr>
<tr class="a">
<td align="center" valign="top"> <table width="64" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td align="center"><br> <img src="images/2.gif" width="32" height="32" onmouseover="this.className='d'" onmouseout="this.className='b'"></td>
</tr>
<tr>
<td align="center">病人费用 </td>
</tr>
<tr>
<td align="center"><br> <img src="images/1.gif" width="32" height="32" onmouseover="this.className='d'" onmouseout="this.className='b'"></td>
</tr>
<tr>
<td align="center">项目查询</td>
</tr>
<tr>
<td align="center"><br> <img src="images/3.gif" width="32" height="32" onmouseover="this.className='d'" onmouseout="this.className='b'"></td>
</tr>
<tr>
<td align="center">费用指标</td>
</tr>
</table></td>
</tr>
<tr class="c" onclick="aaa(this);">
<td height="28" align="center" background="images/bg4.gif" >
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr align="center">
<td><img src="images/dot1.gif" width="8" height="8"></td>
<td><font color="#000000">系统维护</font></td>
<td><img src="images/dot.gif" width="8" height="8"></td>
</tr>
</table>
</td>
</tr>
<tr class="a">
<td align="center" valign="top"> <table width="64" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td align="center"><br> <img src="images/2.gif" width="32" height="32" onmouseover="this.className='d'" onmouseout="this.className='b'"></td>
</tr>
<tr>
<td align="center">用户密码</td>
</tr>
<tr>
<td align="center"><br> <img src="images/1.gif" width="32" height="32" onmouseover="this.className='d'" onmouseout="this.className='b'"></td>
</tr>
<tr>
<td align="center">数据连接</td>
</tr>
<tr>
<td align="center"><br> <img src="images/3.gif" width="32" height="32" onmouseover="this.className='d'" onmouseout="this.className='b'"></td>
</tr>
<tr>
<td align="center">其他设置</td>
</tr>
</table></td>
</tr>
<tr>
<td height="22" align="center" background="images/bg3.gif">2004年5月15日</td>
</tr>
<tr>
<td height="200" > </td>
</tr>
<tr>
<td height="22" background="images/bg3.gif"></td>
</tr>
</table>
<script>
function aaa(obj)
{
for(i=0;i<6;i++)
{
if(i % 2 ==1)
{
tb.rows[i].className="a";
}
}
if(obj.className="c" )
{
if(tb.rows(obj.rowIndex+1).className=="b")
{
tb.rows(obj.rowIndex+1).className="a";
}
else
{
tb.rows(obj.rowIndex+1).className="b";
}
}
}
</script>
Top
3 楼superdullwolf(超级大笨狼,每天要自强,MVP)回复于 2004-08-01 09:56:11 得分 0
sys_top.asp
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title> 数据采集系统</title>
<link href="css/main.css" rel="stylesheet" type="text/css">
</head>
<body >
<table width="100%" height="64" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td rowspan="2" align="right" valign="bottom" ><B><em> </em></B></td>
<td align="center" valign="bottom" nowrap ><B><em><font size="4">长宁区数据采集系统
</font></em></B></td>
<td align="left" valign="bottom" nowrap ><em ><font size="3">ChangNing
Data collection System </font></em> </td>
<td width="352" height="58" rowspan="2" align="right" valign="middle" background="images/top_r.gif" ><img src="images/home.gif" alt=连接华山公司站点 width="32" height="32" onClick="//window.location.href='http://www.czwsm.com'"> </td>
</tr>
<tr>
<td align="left" valign="bottom" > </td>
<td align="left" valign="bottom" > </td>
</tr>
</table>
<table width="100%" height="28" border="0" cellpadding="0" cellspacing="0" background="images/bg4.gif">
<tr valign="middle">
<td width=60% align="left"> <img src="images/dot1.gif" width="8" height="8"></td>
<td align="middle"><a href="JavaScript:query();">|查询|</a></td>
<td align="middle" ><a href="JavaScript:myPrint();" >|打印|</a></td>
<td align="middle" ><a href="JavaScript:myDirPrint();" >|直接打印|</a></td>
<td align="middle" ><a href="JavaScript:myPageSet();" >|页面设置|</a></td>
<td align="middle" ><a href="JavaScript:myClose();" >|关闭|</a></td>
<td align="right"><img src="images/dot.gif" width="8" height="8"> </td>
</tr>
</table>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="2" bgcolor="#c2c2d5"></td>
</tr>
</table>
<SCRIPT LANGUAGE=javascript>
<!--
function query()
{
//查询
var myLocation=new String;
myLocation=top.frames('frmMain').location.href;
}
function myPrint()
{
//打印
var myLocation=new String;
myLocation=top.frames('frmMain').location.href;
if( myLocation.indexOf("output")>1)
{
top.frames('frmMain').focus();
top.frames('frmMain').WebBrowser.ExecWB(6,1);
}
else
{
alert("本系统只提供打印输出页面,如果要打印其他页面,请在该页面上点右键,选择打印")
}
}
function myDirPrint()
{
//直接打印
var myLocation=new String;
myLocation=top.frames('frmMain').location.href;
if( myLocation.indexOf("output")>1)
{
top.frames('frmMain').focus();
top.frames('frmMain').WebBrowser.ExecWB(6,6);
}
else
{
alert("本系统只提供打印输出页面,如果要打印其他页面,请在该页面上点右键,选择打印")
}
}
function myPageSet()
{
//页面设置
top.frames('frmMain').focus();
top.frames('frmMain').WebBrowser.ExecWB(8,1);
}
function myClose()
{
window.opener=null;
top.window.close();
}
//-->
</SCRIPT>
</body>
</html>
Top
4 楼s1ihome(My hometown is a beautiful village)回复于 2004-08-01 10:00:25 得分 6
整个代码给出了:)
你下载动网论坛那个管理界面也是差不多这种下拉菜单吧,
一次只能打开一个菜单的js
var count=0;//做计数器
var limit=new Array();//用于记录当前显示的哪几个菜单
var countlimit=1;//同时打开菜单数目,可自定义
function expandIt(el) {
obj = eval("sub" + el);
if (obj.style.display == "none") {
obj.style.display = "block";//显示子菜单
if (count<countlimit) {//限制2个
limit[count]=el;//录入数组
count++;
}
else {
eval("sub" + limit[0]).style.display = "none";
for (i=0;i<limit.length-1;i++) {limit[i]=limit[i+1];}//数组去掉头一位,后面的往前挪一位
limit[limit.length-1]=el;
}
}
else {
obj.style.display = "none";
var j;
for (i=0;i<limit.length;i++) {if (limit[i]==el) j=i;}//获取当前点击的菜单在limit数组中的位置
for (i=j;i<limit.length-1;i++) {limit[i]=limit[i+1];}//j以后的数组全部往前挪一位
limit[limit.length-1]=null;//删除数组最后一位
count--;
}
}
Top
5 楼luoluonozuoluo(学不会就去死;因为怕死所以死都要学会)回复于 2004-08-01 10:01:50 得分 4
思路~~<span id="*" style="display:none">Content</span>
脚本实现
spanObj = document.getElementsById(idname)
if(spanObj.style=="none")
spanObj.style="";
else
spanObj.style="none")
就这样啦。Top
6 楼superdullwolf(超级大笨狼,每天要自强,MVP)回复于 2004-08-01 10:13:33 得分 0
我这个效果
http://218.1.120.114/ybquery/Top
7 楼superdullwolf(超级大笨狼,每天要自强,MVP)回复于 2004-08-01 10:14:42 得分 10
本来是多级菜单,靠有个白痴非要改成一个栏目Top




