update

README.md

@@ -7,4 +7,6 @@
 3. [增加一个footer](./dom/增加一个footer.md)
 4. [隐藏侧边栏](./dom/隐藏侧边栏.md)
 5. [侧栏移动到右侧](./dom/侧栏移动到右侧.md)
-6. [贴底隐藏的侧边栏](./dom/贴底隐藏的侧边栏.md)
+6. [贴底隐藏的侧边栏](./dom/贴底隐藏的侧边栏.md)
+7. [按鼠标中键关闭标签](./dom/按鼠标中键关闭标签.md)
+8. [全屏状态下左右切换按钮](./dom/全屏状态下左右切换按钮.md)

dom/全屏状态下左右切换按钮.md

@@ -0,0 +1,99 @@
+# 全屏状态下左右切换按钮
+## js
+```
+var time = 30;
+var timer;
+//  创建两个箭头
+var left = $("<span class=\"plugin-triangle-left\"></span>");
+var right = $("<span class=\"plugin-triangle-right\"></span>");
+//  切换tab的方法,详见 Dec.globleModel 的定义
+var slideTab = function (v) {
+    var currValue = Dec.globleModel.selectedTab;
+    var nextValue;
+    $.each(Dec.globleModel.openedTabs, function (index, tab) {
+        if (tab.value === currValue) {
+            nextValue = Dec.globleModel.openedTabs[index + v].value;
+        }
+    });
+    Dec.globleModel.selectedTab = nextValue;
+};
+// 全屏后绑定事件
+var onFullscreen = function () {
+    $(document.fullscreenElement).append(right);
+    $(document.fullscreenElement).append(left);
+    left.hide("slow");
+    right.hide("slow");
+    left.click(function () {
+        slideTab(-1);
+    });
+    right.click(function () {
+        slideTab(1);
+    });
+    $(document).mousemove(function (e) {
+        left.show("slow");
+        right.show("slow");
+        time = 30;
+        if (!timer) {
+            timer = setInterval(function () {
+                time--;
+                if (time < 0) {
+                    left.hide("slow");
+                    right.hide("slow");
+                }
+            }, 100);
+        }
+    });
+};
+
+//  退出全屏后去掉两个箭头
+var onExitFullscreen = function () {
+    left.remove();
+    right.remove();
+    clearInterval(timer);
+};
+
+//  全屏事件
+document.onfullscreenchange = function (ev) {
+    if (document.fullscreenElement) {
+        // 如果处于非全屏模式,fullscreenElement 为null
+        onFullscreen();
+        return;
+    }
+    onExitFullscreen();
+};
+```
+## css
+```
+.plugin-triangle-left {
+  cursor: pointer;
+  display: inline-block;
+  border-top: 2px solid;
+  border-right: 2px solid;
+  width: 100px;
+  height: 100px;
+  border-color: #EA6000;
+  transform: rotate(-135deg);
+  margin: 50px auto auto 100px;
+  position: fixed;
+  left: -4%;
+  top: 50%;
+}
+
+.plugin-triangle-right {
+  cursor: pointer;
+  display: inline-block;
+  border-top: 2px solid;
+  border-right: 2px solid;
+  width: 100px;
+  height: 100px;
+  border-color: #EA6000;
+  transform: rotate(45deg);
+  margin: 50px auto auto 100px;
+  position: fixed;
+  right: 3%;
+  top: 50%;
+}
+```
+
+## 效果预览
+![](../screenshorts/5.png)

dom/按鼠标中键关闭标签.md

@@ -0,0 +1,15 @@
+# 按鼠标中键关闭标签
+这一个demo使用了一些内置api,你需要查阅[](dddl)
+## js
+```
+// 提供鼠标中键关闭标签页,类似浏览器交互
+BI.Plugin.registerObject("dec.workbench.tabs.button", function (widget) {
+    //  绑定鼠标中键事件
+    widget.element.mousedown(function (event) {
+        if (event.button === 1) {
+            //  调用tabPane api 关闭tab
+            BI.Services.getService("dec.service.tabs").closeTab(widget.getValue());
+        }
+    });
+});
+```