From 3ce6e7d4e078bea8be3536e52540727d08673c84 Mon Sep 17 00:00:00 2001
From: wolegca <2738076308@qq.com>
Date: Sat, 14 Sep 2019 16:44:41 +0800
Subject: [PATCH] add some effects

---
 base.js    |  5 +++--
 index.html |  2 +-
 myui.css   | 23 ++++++++++++++++++++++-
 3 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/base.js b/base.js
index 0adffed..d0341e3 100644
--- a/base.js
+++ b/base.js
@@ -25,7 +25,7 @@ $(function () {
 		m.css('animation','fadeOut .3s forwards');
 		setTimeout(function(){
 			p.remove();
-			m.hide();
+			m.remove();
 		},300);
 	});
 })();
@@ -44,7 +44,8 @@ var message = new function () {
 			'<div class="msg-footer">'+
 			'<span>关闭</span>'+
 			'</div>' +
-			'</div>'
+			'</div>' + 
+			'<div class="mask"></div>';
 		$(document.body).append(html);
 		$('.mask').show().css('animation','fadeIn .2s forwards');
 		$('#mh-'+id).Drag($('#mc-'+id));
diff --git a/index.html b/index.html
index db71aa1..6115610 100644
--- a/index.html
+++ b/index.html
@@ -55,7 +55,7 @@
         </div>
     </div>
 
-    <div class="mask"></div>
+    <!-- <div class="mask"></div> -->
     <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
     <script src="drag.js"></script>
     <script src="base.js"></script>
diff --git a/myui.css b/myui.css
index c6fec00..1d4ccbb 100644
--- a/myui.css
+++ b/myui.css
@@ -99,10 +99,11 @@ body {
 	position: fixed;
 	top: 0;
 	left: 0;
-	width: 50px;
+	width: 60px;
 	height: 30px;
 	cursor: pointer !important;
 	z-index: 4;
+	padding-left: 10px
 }
 
 [for=menu-control].menu-button-container:hover span {
@@ -132,9 +133,29 @@ body {
 	height: 3px;
 	background-color: #ccc;
 	display: block;
+	position: relative;
 	margin: 5px 0 0 3px;
 	cursor: pointer;
 	transition: all .5s ease;
+	left:0px;
+	top:0px
+}
+
+#menu-control:checked~.menu-button-container .menu-button>span:nth-child(1){
+	transform:rotate(-30deg);
+	width:20px;
+	top:2px
+}
+
+#menu-control:checked~.menu-button-container .menu-button>span:nth-child(2){
+	transform:rotate(180deg);
+	width:30px
+}
+
+#menu-control:checked~.menu-button-container .menu-button>span:nth-child(3){
+	transform:rotate(30deg);
+	width:20px;
+	top:-2px
 }
 
 .content-border {