如何使网页上面的横条显示出凸起的效果(急)

mshouse 2003-06-30 02:25:06
也就是说在地址栏下面的:“首页 新闻 邮件 短信 帮助 ....”一类的横条显示出凸起效果。就是此网页(如上)文件...和后退...工具条一样的显示效果!应该怎样做。
用什么来控制,最好给一个示范。可加分!!!
...全文
317 4 打赏 收藏 转发到动态 举报
写回复
用AI写文章
4 条回复
切换为时间正序
请发表友善的回复…
发表回复
mshouse 2003-06-30
  • 打赏
  • 举报
回复
怎样实现,??
mshouse 2003-06-30
  • 打赏
  • 举报
回复
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<!-- saved from url=(0038)http://gf.yf163.com/tmp/tc/menu_xp.htm -->
<HTML><HEAD><TITLE></TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<META content="Microsoft FrontPage 4.0" name=GENERATOR>
<META content=FrontPage.Editor.Document name=ProgId>
<SCRIPT src="menu_xp.files/menu_xp.js"></SCRIPT>
<SCRIPT>

var table=new Array;
var doc="";
function record(menu,menuItem,submenu,linkto,itemImg,subImg)
{
this.menu=menu;
this.menuItem=menuItem;
this.submenu=submenu;
this.linkto=linkto;
this.itemImg=itemImg;
this.subImg=subImg;
}
/*function mnItem(menuItem,type,num)
{
this.menuItem=menuItem;
this.type=type;
this.num=num;
}*/
var sysMenu=new Array;
sysMenu[0]='销售管理';
sysMenu[1]='系统登录';
sysMenu[2]='系统管理';
table[0]=new record('销售管理','销售机会','线索管理','float.htm','image/帮助.gif','image/帮助.gif');
table[1]=new record('销售管理','销售机会','客户挖掘','float.htm','image/帮助.gif','image/帮助.gif');
table[2]=new record('销售管理','电话营销','0','float.htm','','');

table[3]=new record('销售管理','客户管理','潜在客户','../sale/deliverbill_make_index.htm','image/帮助.gif','image/帮助.gif');
table[4]=new record('销售管理','客户管理','目标客户','../sale/deliverBill_sele_index.htm','image/帮助.gif','image/帮助.gif');
table[5]=new record('销售管理','客户管理','客户管理','../sale/priceBill_make_index.htm','image/帮助.gif','image/帮助.gif');

table[6]=new record('销售管理','销售进程','进程定义','../sale/freight_edit_index.htm','image/帮助.gif','image/帮助.gif');
table[7]=new record('销售管理','销售进程','销售活动','../sale/freight_sele_index.htm','image/帮助.gif','image/帮助.gif');
table[8]=new record('销售管理','销售进程','销售任务','../sale/freight_set_index.htm','image/帮助.gif','image/帮助.gif');

table[9]=new record('系统登录','更改密码','0','main.htm','image/帮助.gif');
table[10]=new record('系统登录','更换用户','0','../sale/area_sele_index.htm');
table[11]=new record('系统管理','退出系统','0','../sale/returnPlan_make_index.htm');
table[12]=new record('系统管理','系统变更','0','../sale/returnPlan_make_index.htm');

//接口函数
//menu 为主菜单,mmenu为一级,submeun二级,linkto 为层中选项的链接

var smenu=new Array;


//得到menuItem数组
//参数:menu_name
function chosed_mainmenu(menu_name){
var lmenu=new Array;
var line_number=new Array;
var mnText="";
var lnum=0;
line_number=chosed_line_number(menu_name);
for(i=0;i<line_number.length;i++){
if(top.table[line_number[i]].submenu=="0")
{
lmenu[lnum]=new mnItem(top.table[line_number[i]].menuItem,"url",line_number[i]);
lnum++;
}
else
{
if(mnText!=top.table[line_number[i]].menuItem)
{
lmenu[lnum]=new mnItem(top.table[line_number[i]].menuItem,"sub",0);
mnText=top.table[line_number[i]].menuItem
lnum++;
}
}
}
alert(lmenu.lengh)
return lmenu;
}

//得到符合menu_name的行号
function chosed_line_number(menu_name){
var line_number=new Array;
var j=0;
for(i=0;i<top.table.length;i++){
if(top.table[i].menu==menu_name){
line_number[j]=i;
j++;
}
}
return line_number;
}

function addItem(num1)
{
var line_number=new Array;
var mnText="";
var lnum=0;
line_number=chosed_line_number(sysMenu[num1-1]);
for(i=0;i<line_number.length;i++){
if(top.table[line_number[i]].submenu=="0")
{
m[num1].add(table[line_number[i]].menuItem,table[line_number[i]].itemImg,"url",table[line_number[i]].linkto)
}
else
{
if(mnText!=top.table[line_number[i]].menuItem)
{
addSubMenu(line_number[i],lnum)
mnText=top.table[line_number[i]].menuItem
m[num1].add(table[line_number[i]].menuItem,table[line_number[i]].itemImg,"sub",smenu[lnum])
lnum++;
}
}
}
}

function addSubMenu(num1,num2)
{
smenu[num2]=new menu_xp();//建立个菜单实例对象
for(p=0;p<table.length;p++)
{
if(table[num1].menu==table[p].menu && table[num1].menuItem==table[p].menuItem)
{
smenu[num2].add(table[p].submenu,table[p].subImg,"url",table[p].linkto)
}
}

}
</SCRIPT>
<STYLE></STYLE>
</HEAD>
<BODY><BR><BR>
<P style="FONT-WEIGHT: bold; TEXT-ALIGN: center">仿OfficeXP样式菜单应用示例</P>
<P>点击上面的菜单栏显示相应的菜单,点击鼠标右键可显示右键菜单!</P>
<P>程序代码:</P>
<DIV id=divCode style="WIDTH: 100%; BACKGROUND-COLOR: #eeeeee"></DIV>
<HR>

<P align=center>copywrite by 赖国欣 2003/6 All right reserved</P>
<P align=center>Email: <A href="mailto:a@lai.com.cn">a@lai.com.cn</A> website:
<A href="http://www.9499.net/">http://www.9499.net/</A> </P>
<SCRIPT>
/***********************************
仿OfficeXP样式菜单应用示例
赖国欣设计于2003年6月,保留所有权利!
************************************/
var mc=new menu_bar_xp(0,0);
var m=new Array;

for(ii=1;ii<=sysMenu.length;ii++)
{
m[ii]=new menu_xp();//建立个菜单实例对象
mc.add(sysMenu[ii-1],m[ii]);//菜单栏
//添加菜单项
addItem(ii);
}


/*m5.add("无限级子菜单演示","images/flower.gif","sub",m3)
m5.seperate()
m5.add("刷新页面","images/refresh.gif")
m5.add("添加到收藏夹","images/star.gif")
m5.add("设为首页","images/home.gif")
m5.seperate()
m5.addLink("http://www.9499.net","9499.NET主页","","images/home.gif")
m5.addLink("http://www.9499.net?go=ly","访客留言中心","","images/rose.gif")
m5.addLink("http://www.9499.net?go=tc","在线教程","","images/teach.gif")

m3.item[1].execute=m4.item[1].execute=m5.item[1].execute=function(){self.history.go(0);}
m3.item[2].execute=m4.item[2].execute=m5.item[2].execute=function()
{
window.external.addFavorite("http://www.9499.net","创意无限,精彩无限--WWW.9499.NET");
}
m3.item[3].execute=m4.item[3].execute=m5.item[3].execute=function()
{
event.srcElement.style.behavior="url(#default#homepage)";
event.srcElement.setHomePage("http://www.9499.net");
}*/

/*显示右键菜单*/
document.body.oncontextmenu=function(){event.returnValue=false;}
document.body.onmousedown=function(){if(event.button==2)m[3].show();}

/*显示源程序
var script=document.getElementsByTagName("SCRIPT")
var sCode=script[1].innerHTML
sCode=sCode.replace(/</g,"<").replace(/>/g,">")
sCode=sCode.replace(/([A-Za-z0-9><_\)\(\]\[\}\{\. \$/;=\+\?"&:-]{2,})/g,"<font color='green'>$1</font>");
sCode=sCode.replace(/\t/g,"    ")
sCode=sCode.replace(/(\/\*)/g,"<font color='maroon'>$1")
sCode=sCode.replace(/(\*\/)/g,"$1</font>")
sCode=sCode.replace(/\n/g,"<br>")
divCode.innerHTML=sCode;*/
</SCRIPT>
</BODY></HTML>
test1000 2003-06-30
  • 打赏
  • 举报
回复
用CSS:
1、当鼠标移动到“首页 新闻 邮件 短信 帮助 ....”一类的横条上时触发onmouseover事件
2、通过onmouseover事件驱动函数
3、函数内部写:横条id.style.border="outset";

思路就是这样。
liuruhong 2003-06-30
  • 打赏
  • 举报
回复
<style>
.outerLayer{
border:1px outset;
background:menu;
}
</style>

61,111

社区成员

发帖
与我相关
我的任务
社区描述
层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
社区管理员
  • HTML(CSS)社区
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

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