`
tntxia
  • 浏览: 1511058 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

MenuBar是EasyAjax中的实现

CSSJavaScript旅游prototypeAjax 
阅读更多
xml 代码
  1. <html xmlns="http://www.w3.org/1999/xhtml">  
  2. <head>  
  3. <title>澳翔航空港title>  
  4.   
  5. <script type="text/javascript" src="jscalendar/calendar.js">script>  
  6. <script type="text/javascript" src="jscalendar/lang/calendar-zh.js">script>  
  7. <script type="text/javascript" src="js/prototype.js">script>  
  8. <script type="text/javascript" src="js/easyajax.js">script>  
  9. <link href="css/style.css" rel="stylesheet" type="text/css"/>  
  10. <link rel="alternate stylesheet" type="text/css" media="all" href="../css/calendar-blue.css" title="winter" />  
  11. head>  
  12.   
  13. <body onload="ajax.DomBean.InitPage();">  
  14.     <div id="MenuArea" width="800" background="#cccccc">  
  15.     <ul jsclass="easy.MenuBar">  
  16.           <li><a href="index.htm">主页a>li>  
  17.       <li><a href="login.htm">登陆a>li>  
  18.       <li><a href="register.htm">注册a>li>  
  19.       <li><a href="#">查询a>  
  20.          <ul>  
  21.             <li><a href="ticketSearch.htm">机票查询a>li>  
  22.             <li><a href="hotelSearch.htm">酒店查询a>li>  
  23.          ul>           
  24.       li>  
  25.       <li>  
  26.          <a href="#">旅游杂志a>  
  27.          <ul>  
  28.          <li><a href="magzine/beijing.htm">历史名城 - 北京a>li>  
  29.          <li><a href="http://www.shanghai.gov.cn/">文化都会 - 上海a>li>  
  30.          ul>  
  31.       li>  
  32.       <li>  
  33.          <a href="#">旅游论坛a>  
  34.       li>  
  35.       <li><a href="mailto:shin.chen@et-china.com">联系我们a>li>  
  36.       ul>     
  37.     div>  
  38.   
  39. <p>     
  40.   <input name="button3" type="button" onclick="Element.toggle('src');" value="Toggle Source Code" />  
  41.   <textarea id="src" class="srcarea" rows="10" style="width:100%;display:none" disabled="true" >  
  42.   textarea>  
  43. p>  
  44.   
  45. <script type="text/javascript">  
  46.      $("src").value=$("MenuArea").innerHTML;   
  47. script>  
  48. body>  
  49. html>  

具体的实现说明

１.　实现需要两个JS，

xml 代码
  1. <script type="text/javascript" src="js/prototype.js">script>  
  2. <script type="text/javascript" src="js/easyajax.js">script>  

可能从EasyAjax里面得到

２.　需要ul标签，并把它的jsclass属性设为easy.MenuBar，如果ul内还有ul那么就会出现下拉菜单的效果

３　需要CSS，也可以在EasyAjax上得到

xml 代码
  1. <link href="css/style.css" rel="stylesheet" type="text/css"/>  

４　效果图

  • 大小: 8.5 KB
分享到：
| 使用TextArea
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    matlab开发-MenuBar

    在MATLAB中，`MenuBar`是一个非常重要的组件，它用于在图形用户界面（GUI）上创建菜单条。这个工具使得用户能够通过点击菜单项来触发不同的功能或操作，极大地提升了程序的交互性和用户体验。在本项目中，我们将深入...

    用工具栏实现MenuBar简单实用.rar

    在本文中，我们将深入探讨如何使用工具栏（ToolBar）来实现MenuBar，这是一个在软件开发中常见且实用的技术，尤其在Windows或跨平台GUI应用程序中。我们将会通过分析`MyToolBar.cpp`和`MyToolBar.h`这两个文件来了解...

    QML 通过ListView 自定义实现 MenuBar

    通过QML中ListView 实现的 MenuBar。QML 自带的组件 MenuBar无法实现高度的自定义样式，只能选择官方设定好的几种样式，在实际应用场景中，我们需要根据程序整体的 UI 风格来设计 MenuBar 中 Menu 的样式，

    Flex MenuBar小例子

    FLex MenuBar的小例子，可以实现下拉菜单的效果，可直接拷贝使用

    窗口都增加一个Menubar.docx

    1. **Menubar在用户界面设计中的作用**：Menubar是操作系统中提供应用功能的重要界面元素，尤其是在多任务环境下，方便用户快速访问和操作。 2. **提升用户体验的解决方案**：Binary Bakery Software的工具通过为每...

    menubar_rebar_rightclick

    标题“menubar_rebar_rightclick”以及描述“menubar rebar rightclick”提及的是Windows应用程序开发中的特定功能，涉及到菜单栏（menubar）、Rebar控件以及右键点击事件处理。在Windows API编程中，这些元素是构建...

    QT代码创建界面(MenuBar,ToolBar)

    在压缩包中的`ImageViewer1`文件可能是示例代码的一部分，可能是一个图像查看器应用，它可能扩展了上面的代码，实现了显示和操作图像的功能。例如，`QAction`可能关联了打开图片、保存图片或应用图像滤镜等操作。 ...

    Flex MenuBar从数据库中动态加载图片

    总结，通过上述步骤，我们可以成功地在Flex的`MenuBar`中实现从数据库动态加载图片的功能。这个过程涉及到了Flex的组件渲染机制、数据绑定、HTTP服务调用以及JSON数据解析。这样的功能可以显著提升应用的用户体验，...

    menubar_delphi_TMenuBar_COMPONENT_

    - `MenuBar.pas`是`TMenuBar`组件的源代码文件，其中包含了`TMenuBar`类的定义及其所有方法和属性。通过阅读源码，开发者可以了解其内部工作原理，以便更好地利用和自定义该组件。 - `MenuBarDesign.res`是资源...

    vue_menubar.rar

    本案例“vue_menubar.rar”是基于Vue.js实现的一个模仿饿了么的横向导航栏，适用于快速构建具有类似功能的项目。MockJS则是一个用于前端开发中模拟数据的工具，它可以模拟各种接口返回的数据，使得在没有后端配合...

    QML自定义菜单样式

    为了在Qt5.10及以上版本中实现这些自定义样式，你需要确保在项目中引入了正确的QML模块。对于`MenuItem`和`MenuBar`，你需要导入`QtQuick.Controls`模块，如`import QtQuick.Controls 2.x`（x代表你使用的Qt版本对应...

    menubar

    接下来，我们将深入探讨菜单栏的概念、功能以及如何在不同的编程环境中实现它。 菜单栏是一个包含了多个菜单的水平条目，每个菜单又包含一系列的命令或子菜单，用户可以通过点击这些命令来执行相应的操作。在桌面...

    menubar_sc的素材

    在IT行业中，"menubar_sc"的素材通常指的是与用户界面设计相关的元素，特别是涉及到菜单栏的视觉元素和交互设计。菜单栏是图形用户界面（GUI）中的一个重要组成部分，它通常位于应用程序窗口的顶部，提供对主要功能...

    MenuBar Control_control_

    【MenuBar Control】是一种在Visual Basic 6 (VB6)编程环境中使用的控件，它主要用于创建应用程序的菜单栏。菜单栏是用户界面中的一个重要元素，它提供了对程序功能的直观访问，通常位于窗口的顶部。MenuBar Control...

    flex动态菜单(Menubar)

    本篇将详细讲解如何利用Flex中的Menubar组件和XML配置来实现动态菜单，并在itemClick事件中处理次级子菜单。 1. **Menubar组件**：Flex的Menubar组件是一个顶部菜单条，它包含一组下拉式菜单项。每个菜单项都可以...

    toolbar\\menubar扩展点

    在给定的压缩包文件eclipse_rich_ajax_platform中，可能包含了一些关于如何在Eclipse RCP环境中实现Ajax功能的示例或库。Ajax（Asynchronous JavaScript and XML）是一种在无需刷新整个页面的情况下更新部分网页的...

    Python tkinter 9 Menubar 菜单 (GUI 窗口 教学教程tutorial)

    Python_tkinter_9_Menubar_菜单_(GUI_窗口_教学教程tutorial)

    IOS应用源码之【框架】别具风格的menubar与tabbar.rar

    在iOS中，系统的UINavigationBar是默认的导航栏实现，但有时为了追求独特的用户界面设计或品牌一致性，开发者会自定义menubar。这份源码可能包含如何使用自定义视图、动画效果或者扩展系统框架来创建具有独特风格的...

Magicbox
Global site tag (gtag.js) - Google Analytics