MENUBAR菜单的编写

最新推荐文章于 2022-10-15 21:32:20 发布
最新推荐文章于 2022-10-15 21:32:20 发布
阅读量505 收藏
点赞数
分类专栏： HTML 文章标签： function null border div javascript menu

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>AgetimeMenu Demo</title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <style> .agetime_bar{ position:absolute;top:0px;left:0px;height:22px;width:100%;border:1px outset;background-color:RGB(212,208,200);z-index:98; } .agetime_barItem{ width:60px;height:20px;border:1px solid RGB(212,208,200);text-align:left;padding-left:10px; background:RGB(212,208,200);color:#000000;font-size:9pt; } .agetime_barItemDown{ width:60px;height:20px;border:1px inset RGB(212,208,200);text-align:left;padding-left:10px; background:#F0F0F0;color:#000000;font-size:9pt; } .agetime_barItemHover{ width:60px;height:20px;border:1 outset;text-align:left;padding-left:10px; background:#F0F0F0;color:#000000;font-size:9pt; } .agetime_pad{ cursor:default;font-size:9pt;width:100%; } .agetime_padItem{ width:100%;height:18px;border:1px solid RGB(212,208,200);text-align:left;padding-left:10px; background:RGB(212,208,200);color:#000000;font-size:9pt; } .agetime_padItemFalse{ padding-left:10px;font-size:9pt; color:#808080; } .agetime_padItemFalseHover{ padding-left:10px;font-size:9pt; color:#808080;background-color:#333366; } .agetime_padItemHover{ width:100%;height:18px;text-align:left;padding-left:10px; background-color:#333366;color:#FFFFFF;font-size:9pt; } .agetime_padItemDown{ width:100%;height:18px;text-align:left;padding-left:10px;border:1px inset; background-color:#9999CC;color:#FFFFFF;font-size:9pt; } .agetime_hr{ border:1px inset; } .agetime_board{ background-color:RGB(212,208,200);border:2px outset; } </style> </head>

　

 

<body> <script language="javascript"> var menu = agetimeMenu("agetime", [    [     ["文件",null,null,true,"打开文件"], //显示文字,方法,命令,状态,状栏显示文字     ["打开",null,null,false,"打开文件"],     ["--"],     ["你好","js","alert('Hello')",true,"一声问候"],     ["新窗口","ABC","about:blank",true,"弹出ABC窗口"],     ["空白",null,"about:blank",true,"在当前窗口显示空白页"]    ],    [     ["编辑",null,null,false,"打开文件"],     ["撤消",null,null,true,"打开文件"],     ["重做",null,null,true,"打开文件"]    ],    [     ["文件","js","alert('无子菜单')",true,"打开文件"]    ] ] ); //方法为"js"时,命令则为javascript语句,为非"js"值时,命令则是一个URL,而打开这个URL的目标位置则是方法所指定的窗口; //["你好","js","alert('Hello'),true,"一声问候"]; //显示文字为"--"是按钮是一个分隔符;

function agetimeMenu(id,array){ var menu=this; menu.pad=null;     //装载各个子菜单 menu.barItems=[];    //菜单条的各位按钮 menu.pads=[];     //每个子菜单为一个table存放于menu.pad上; menu.selectedIndex=-1; //菜单条选中按钮的索引值 menu.board=null;    //子菜单面板

//建立菜单条 this.crtMenuBar=function(){    var len=array.length;    menu.bar = document.body.appendChild(document.createElement('div'));    menu.bar.className=id+"_bar";    for(var i=0;i<len;i++){     menu.barItems[i]=menu.addMenuBarItem(array[i][0],i);     menu.addMenuPad(array[i],i);    } }

//子菜单 this.addMenuPad=function(ary,index){    var len=ary.length;    var pad=menu.crtElement("table",menu.pad);    pad.cellSpacing=1; pad.cellPadding=0;    pad.className=id+"_pad";

　
 

   pad.style.display="none";    for(var i=1;i<len;i++){     var Row=pad.insertRow(i-1);     menu.addMenuPadItem(ary[i],Row);    }    menu.pads[index]=pad; }

//各子菜单按钮 this.addMenuPadItem=function(ary,Row){     var Cell=Row.insertCell(0);     if(ary[0]!="--"){      Cell.innerText=ary[0];      if(ary[3]){ //有效状态;       Cell.className=id+"_padItem";       Cell.οnmοuseοver=function(){        Cell.className=id+"_padItemHover";        window.status=ary[4];       }       Cell.οnmοuseοut=function(){        Cell.className=id+"_padItem";        window.status="";       }       Cell.οnmοusedοwn=function(){ Cell.className=id+"_padItemDown"; }       Cell.οnmοuseup=function(){        Cell.className=id+"_padItemHover";        menu.hideMenu();        menu.execute(ary);       }      }      else{ //按钮无效;       Cell.className=id+"_padItemFalse";       Cell.οnmοuseοver=function(){        Cell.className=id+"_padItemFalseHover";        window.status=ary[4];       }       Cell.οnmοuseοut=function(){        Cell.className=id+"_padItemFalse";        window.status="";       }      }     }     else{      var hr=menu.crtElement("hr",Cell);      hr.className=id+"_hr";     }     Cell.οnclick=function(){      event.cancelBubble=true;     } }

 

//菜单条的按钮 this.addMenuBarItem=function(ary,index){    var item=menu.crtElement("button",menu.bar);    item.value=ary[0];    item.disabled=!ary[3];    item.className=id+"_barItem";    item.οnmοuseοver=function(){     if(menu.selectedIndex==-1){      item.className=id+"_barItemHover";     }     else{      menu.barItems[selectedIndex].className=id+"_barItem";      item.className=id+"_barItemDown";      menu.showMenu(index);     }     window.status=ary[4];    }    item.οnmοuseοut=function(){     if(menu.selectedIndex==-1) item.className=id+"_barItem";     window.status="";    }    item.οnclick=function(){     event.cancelBubble=true;     if(menu.selectedIndex==-1){      item.className=id+"_barItemDown";      menu.showMenu(index);     }     else{      menu.hideMenu();      item.className=id+"_barItemHover";     }     menu.execute(ary);     item.blur();    }    return item; }

//显示子菜单 this.showMenu=function(index){    if(menu.selectedIndex!=-1) menu.pads[selectedIndex].style.display="none";    menu.board.style.pixelLeft=menu.barItems[index].offsetLeft+2;    //menu.board.style.pixelHeight="";    if(menu.pads[index].rows.length>0) menu.board.style.display="";    else menu.board.style.display="none";    menu.pads[index].style.display="";    menu.selectedIndex=index; }

 

//隐藏子菜单 this.hideMenu=function(){    if(menu.selectedIndex==-1) return;    menu.barItems[menu.selectedIndex].className=id+"_barItem";    menu.pads[selectedIndex].style.display="none";    menu.selectedIndex=-1;    menu.board.style.display="none"; }

//执行菜单命令; this.execute=function(ary){    if(ary[2]==null) return;    if(ary[1]=="js") { eval(ary[2]); menu.hideMenu(); }    else if(ary[1]==null || ary[1].toLowerCase=="_self") location.href=ary[2];    else{ var x=window.open(ary[2],ary[1]); x.focus(); } }

//建立子菜单的显示面板 this.crtMenuBoard=function(){    document.write(     "<div id='"+id+"_board' style='position:absolute;width:160px;height:10px;left:0px;top:20px;background-color:#666666;z-index:99;display:none;'>"+      "<div style='position:absolute;width:100%;height:100%;left:0px;top:0px;'>"+       "<iframe id='"+id+"_frame' name='"+id+"_frame' width='100%' height='100%' frameborder='0' scrolling='no'></iframe>"+      "</div>"+      "<div id='"+id+"_pad' style='position:absolute;width:100%;height:100%;left:0px;top:0px;'></div>"+     "</div>"    );    menu.board=document.getElementById(id+"_board");    menu.pad=document.getElementById(id+"_pad");    menu.pad.className=id+"_board";    menu.pad.onselectstart=function(){ return false;} }

//增加对像的一个子元素 this.crtElement=function(el,p){    return p.appendChild(document.createElement(el)); }

//安装菜单; this.setup=function(){    menu.crtMenuBoard();    menu.crtMenuBar();    document.attachEvent("onclick",menu.hideMenu); }

menu.setup(); } </script> </body> </html>

xiaobao19837
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
menubar控件 qt_Qt Widgets——菜单和菜单栏
weixin_32821263的博客
12-23 1592
主窗口MainWindow需要菜单栏QMenuBar及菜单QMenu来组成自身，一般应用程序的所有功能都能在菜单中找到。接下来就来说说它们。它添加了很多动作QAction，并用自身组成了菜单栏QMenuBar上的菜单，当然也可用于基它地方，如上下文菜单等。公有函数如下：QMenu(QWidget * parent = 0)QMenu(const QString & title, QWidg...
menubar的相关用法
cmh0000的博客
02-14 718
s60 3.2版本支持三个菜单项，比３.０版本多了中间菜单，使用中间菜单，必须在class CVideoEditorAppUi : public CAknAppUi 的ConstructL()函数中加如下的参数．如下： { ...
Qt 创建菜单menubar和工具栏toolbar
YHxiaohao的博客
10-15 3256
Qt 创建菜单menubar和工具栏toolbar,实现toolbar长度和窗体长度一致
primefaces_Primefaces菜单，MenuBar，MenuButton，TieredMenu，SlideMenu示例
从零开始的教程世界
07-09 635
primefacesThe major aim of this tutorial is to cover the main menu components that get used with Primefaces implementation. Typically, a huge amount of applications spread over internet use a differen...
js 创建二级菜单
hoho_12
08-08 1991
js 创建二级菜单
使用Java编写图形化的菜单的教程
09-03
在Java编程中，创建图形化用户界面（GUI）的一个重要组成部分是构建菜单系统。本教程主要关注如何使用Java实现下拉式菜单。下拉菜单在用户界面中提供了一种直观的方式来执行各种操作，它们通常固定在窗口的顶部，如...
menuBar.7z菜单栏
08-31
在IT行业中，"menuBar.7z菜单栏"这个标题暗示了我们正在处理一个与图形用户界面（GUI）设计相关的项目，特别是涉及到菜单栏的实现。这个项目可能使用了QT库，因为"QT"是提供的标签之一。QT是一个广泛使用的跨平台...
Qt菜单切换代码示例代码
04-14
QMenu *fileMenu = menuBar()->addMenu(tr("&File")); QAction *openAction = new QAction(tr("&Open"), this); fileMenu->addAction(openAction); ``` 3. **连接信号和槽**： 使用`connect()`函数将`QAction`...
WPF 后台定义菜单栏
11-05
在这个例子中，我们创建了一个名为`MenuBar`的对象，然后设置了其`Items`集合来添加菜单项。通过这种方式，我们可以在代码中动态创建和管理菜单结构。 **事件处理** 菜单项通常会关联到一些操作，比如打开文件或...
JavaScript CSS菜单功能 改进版
10-30
在之前的实现中，如果菜单项很多，需要在HTML中手动编写大量的DOM元素，这种方法不仅工作量大，而且易出错。改进后的版本通过结合JavaScript和CSS，将菜单的创建逻辑移至JavaScript中，简化了HTML结构。 首先，要在...
Menu Item, Menu & MenuBar类
一行一生
09-19 474
一个菜单项目，可直接使用 Append()函数添加，或 wx.MenuItem 类的一个对象被追加。 wx.Menu.Append(id, text, kind) Item = Wx.MenuItem(parentmenu, id, text, kind) wx.Menu.Append(Item) 要定义一个菜单项，菜单要被添加必须提及。 wxPython中有大量的标准...
tkinter菜单图标，工具栏
derek881122的博客
02-14 1235
所用的图片： import tkinter as tk from tkinter import messagebox, filedialog, simpledialog, colorchooser from tkinter import ttk from PIL import Image, ImageTk ...
微信小程序胶囊按钮返回|首页自定义导航栏详解
weixin_33755557的博客
06-13 4137
小弟初次钻研小程序，希望各位大佬看到有问题的地方及时指出，感谢项目代码：https://github.com/Shay0921/header-navbar.git在小程序中，从转发出来的小程序消息卡片进入，因为页面栈中只有一个，所以不会出现返回按钮，对于一些电商平台来说，当商品被转发后会很影响客户查看其它产品和首页，这时候就需要使用自定义导航栏自己写一个“胶囊按钮”。如下图所示：从别的页面点到商品...
Qt之MenuBar
LC900730的博客
09-15 5568
import QtQuick 2.6 import QtQuick.Controls 1.2 import QtQuick.Window 2.2 import QtQuick.Layouts 1.1ApplicationWindow { // id: name width: 640 height: 480 visible: true title:qsTr("he
Qt用代码实现菜单栏(MenuBar)和工具栏(ToolBar)
热门推荐
TiredWind的博客
03-27 1万+
新建Qt项目，选择Qt Widgets Application，填入项目名称“ImageView”，点击完成。 在Qt Designer里会生成如图所示的几个文件： 此时我们右键删除imageviewer.ui这个文件，因为我们本次是用纯代码的方式生成界面，所以不需要这个ui文件了。 关键代码主要在imageviewer.h和imageviewer.cpp里。下面是代码： ima...
PyQt4 QAction()使用教程
清风飘过
09-17 8653
exit=QtGui.QAction(QtGui.QIcon('pix/Moon.bmp'),'Exit',self) #创建一个action "exti"为title self 为parent exit.setSeparator(bool)#设置设置该action为分离器 也就是分隔符？ 当为true时 QIcon会无效 exit.setShortcut('Ctrl+Q') #设置快
navtop -sidebar -menubar 组合思路
csstmg的博客
10-20 418
app.vue 为主页面 通过路由 定位到 首页 8080/home/index 路由一级要记得写 component: Layout 可以在 <router-view .> 里面写class 从而置顶样式 路由代碼 import Vue from 'vue' import VueRouter from 'vue-router' import Layout from '@/views/layout/index.vue' import { publish } from "@/views/pub.
MenuBar
YL_WH的专栏
08-19 621
// 创建窗口主菜单  HMENU hWndMenu = ::CreateMenu();  HMENU hPopMenu = ::CreatePopupMenu();  ::InsertMenu(hWndMenu, 0, MF_POPUP | MF_INSERT, (int)hPopMenu, TEXT("File(&F)"));  HMENU hSubMenu = ::GetSubMen
Qt 自定义软件标题栏 -- 复用菜单栏menuBar()
zwb0540822的专栏
05-12 5298
复用布局的菜单栏:layout()::menuBar() 2020/04/05 目录 引言 具体内容 效果 需要解决的问题 接口 遇到的问题 主要技术点 引言 最近几个月使用了H5的手机app开发工具HBuilder，越用越发现这个HBuilder非常好用，界面、功能各种细节很好，具体就是简单好用，没有任何多余的显示等，最大程度把屏幕大小利用起来了，这和我的软件理念符合，即功能一定要简洁、好用、不用学可以直接用。 自己的产品有个地方一直想改进下，就...
matlab中如何编写菜单实现7个功能
最新发布
05-30
f = figure('Name', '菜单示例', 'MenuBar', 'none', 'ToolBar', 'none'); % 创建菜单栏 m = uimenu(f, 'Label', '菜单'); % 创建菜单项，并设置回调函数 uimenu(m, 'Label', '功能1', 'Callback', @func1); ui...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值