重做菜单

resources/app/browser.html

@@ -30,6 +30,13 @@
         </li>
         <li class="bowerMenu" id="bowerMenu">
           <span class="icon-th-list"></span>
+          <ul class="OnclickMenu" id="CampusInfoBrowserOnclickMenu">
+            <li>关于我们</li>
+            <li>反馈</li>
+            <li class="MouseMenuMainStep"></li>
+            <li>历史记录</li>
+            <li>清除缓存</li>
+        </ul>
         </li>
     </ul>
     <ul class="MouseMenuMain" id="CampusInfoBrowserMenu">

resources/app/public/css/browser.css

@@ -224,7 +224,21 @@ button.BrowwerAdd {
     height: 100% !important;
     width: 100% !important;
 }
-.MouseMenuMain {
+.OnclickMenu{
+    position: absolute;
+    right: 0;
+    top: 60px;
+    min-width:90pt;
+    display: none;
+    background:#fff;
+    box-shadow: 0 3px 3px 0 rgba(0,0,0,0.14), 0 1px 7px 0 rgba(0,0,0,0.12), 0 3px 1px -1px rgba(0,0,0,0.2);
+    -moz-user-select:none;
+    -webkit-user-select:none;
+    -ms-user-select:none;
+    -khtml-user-select:none;
+    user-select:none;
+}
+.MouseMenuMain{
     position:absolute;
     z-index:22;
     display:none;
@@ -238,16 +252,21 @@ button.BrowwerAdd {
     -ms-user-select:none;
     -khtml-user-select:none;
     user-select:none;
-    padding: 3px 0;
 }
-.MouseMenuMain li {
+.MouseMenuMain li ,.OnclickMenu li{
+    width: auto;
     font-size:12px;
     padding: 6px 8px;
     color: #333;
     text-align: left;
     white-space: nowrap;
 }
-.MouseMenuMain li:hover {
+.MouseMenuMain li:hover{
+    background-color:#ddd;
+    color:#000;
+    cursor:pointer;
+}
+.OnclickMenu li:hover{
     background-color:#ddd;
     color:#000;
     cursor:pointer;

resources/app/public/js/browser.js

@@ -82,6 +82,7 @@ CampusInfoBrowser.CreatBrower=function (address) {//创建窗口
     });
     webview.onmousedown=function (e) {//webview鼠标事件
         CampusInfoBrowser.MouseMenu(CampusInfoBrowser.MouseMenuMain,this,CampusInfoBrowser.MouseMenuCallBack,e)//右键显示创建应用菜单
+        CampusInfoBrowser.OnclickMenu.style.display="none";
     }
     ListBody.tag_close.onclick=function () {//点击标题页关闭按钮
         event.stopPropagation();
@@ -143,6 +144,7 @@ CampusInfoBrowser.MouseMenu=function (menu_main,data,callback,e) {//右键菜单
         for(var i=0;i<MouseMenuMain.length;i++){
             MouseMenuMain[i].style.display='none';//隐藏
         }
+        callback(data);//webview传入回调函数
     };
 };
 CampusInfoBrowser.MouseMenuCallBack=function (webview) {//右键菜单回调函数
@@ -258,8 +260,9 @@ CampusInfoBrowser.Init=function () {//初始化
     CampusInfoBrowser.UrlArea=$(".bowerSeach input")[0];//获取搜索框
     CampusInfoBrowser.NavContainer=$(".bowerCreaterWindow")[0];//获取标签页ul
     CampusInfoBrowser.AddButton=$(".BrowwerAdd")[0];//获取新建标签页按钮
-    CampusInfoBrowser.BrowersButtom=$("#bowerMenu")[0];//获取打开菜单
+    CampusInfoBrowser.BrowersMenuButtom=$("#bowerMenu")[0];//获取打开菜单
     CampusInfoBrowser.MouseMenuMain=$("#CampusInfoBrowserMenu")[0];//获取右键菜单
+    CampusInfoBrowser.OnclickMenu=$("#CampusInfoBrowserOnclickMenu")[0];//获取菜单
     CampusInfoBrowser.AddButton.onclick= function (){//点击新建标签页
         CampusInfoBrowser.CreatBrower('');
         var canGoForward = $(".icon-right")[0];//获取前进图标
@@ -274,31 +277,18 @@ CampusInfoBrowser.Init=function () {//初始化
             this.previousSibling.children[0].children[0].style.display = "none";
         }
     };
-    CampusInfoBrowser.BrowersButtom.onclick=function (e) {//点击菜单
-        e.preventDefault();
-        CampusInfoBrowser.MenuMain.popup(remote.getCurrentWindow());//打开创建的菜单
+    CampusInfoBrowser.BrowersMenuButtom.onclick=function (event) {//点击菜单
+        // event.preventDefault();
+        CampusInfoBrowser.OnclickMenu.style.display="block";
+        (event || window.event).cancelBubble = true
     };
-    CampusInfoBrowser.MenuMain = new Menu();//创建菜单
-    CampusInfoBrowser.MenuMain_template=[
-        {
-            label: '关于我们                   ',
-            role: '关于我们',
-        },
-        {
-            label: '反馈                    ',
-            role: '反馈',
-        },
-        {
-            label: '历史记录                    ',
-            role: '历史记录',
-        },
-        {
-            label: '清除缓存                    ',
-            role: '清除缓存',
-        }
-    ];//创建菜单项数组的数组
-    CampusInfoBrowser.MenuMain = Menu.buildFromTemplate(CampusInfoBrowser.MenuMain_template);
-    Menu.setApplicationMenu(CampusInfoBrowser.MenuMain);//创建应用菜单
+    document.onclick = function (){
+        CampusInfoBrowser.OnclickMenu.style.display="none";
+    };
+   
+   
+  
+   
     CampusInfoBrowser.IconLock = function(){//判断是否为https
         var http = /^(http)/;//http
         var https = /^(https)/;//https
@@ -313,6 +303,6 @@ CampusInfoBrowser.Init=function () {//初始化
             elm.style.width=elm.style.height='100%';//给webview设置100%宽高
         });
     };
-    setInterval('CampusInfoBrowser.Action()',1000);   
+    setInterval('CampusInfoBrowser.Action()',1000);  
     CampusInfoBrowser.CreatBrower('https://www.baidu.com');//开始进入一个页面
 }();