Kaynağa Gözat

Merge branch 'master' of http://192.168.1.222:3000/lihai/PingAnYeXianSZCG_Web

mengjie 8 yıl önce
ebeveyn
işleme
431910dcda
2 değiştirilmiş dosya ile 45 ekleme ve 2 silme
  1. 2 0
      CallCenterWeb.UI/css/personal.css
  2. 43 2
      CallCenterWeb.UI/index.html

+ 2 - 0
CallCenterWeb.UI/css/personal.css

@@ -18,6 +18,8 @@
18 18
         .perBox {
19 19
             border: 1px solid #eeeeee;
20 20
             height: 400px;
21
+                         box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 50px
22
+
21 23
         }
22 24
 
23 25
         .ptop {

+ 43 - 2
CallCenterWeb.UI/index.html

@@ -1436,7 +1436,7 @@
1436 1436
 			</div>
1437 1437
 		</div>
1438 1438
 		<!--修改密码开始-->
1439
-		<div class="personal">
1439
+		<div class="personal" id="box">
1440 1440
 			<div class="ptop clearFix">
1441 1441
 				<p class="ptl">个人中心</p>
1442 1442
 				<p class="ptr" title="关闭">x</p>
@@ -2624,7 +2624,48 @@
2624 2624
 					}
2625 2625
 				})
2626 2626
 			})
2627
-			//来电号码
2627
+			//拖动事件
2628
+		 var box = document.getElementById("box");
2629
+ //鼠标按下的函数
2630
+ box.onmousedown = function(ev) {
2631
+ var oEvent = ev || event;
2632
+ //求出鼠标和box的位置差值
2633
+ var x = oEvent.clientX - box.offsetLeft;
2634
+ var y = oEvent.clientY - box.offsetTop;
2635
+ console.log(x);
2636
+ //鼠标移动的函数
2637
+ //把事件加在document上,解决因为鼠标移动太快时,
2638
+ //鼠标超过box后就没有了拖拽的效果的问题
2639
+ document.onmousemove = function(ev) {
2640
+  var oEvent = ev || event;
2641
+  
2642
+  //保证拖拽框一直保持在浏览器窗口内部,不能被拖出的浏览器窗口的范围
2643
+  var l = oEvent.clientX - x;
2644
+  var t = oEvent.clientY - y;
2645
+  if(l < 0) {
2646
+  l = 0;
2647
+  
2648
+  } else if(l > document.documentElement.clientWidth - box.offsetWidth) {
2649
+  l = document.documentElement.clientWidth - box.offsetWidth;
2650
+  }
2651
+  if(t < 0) {
2652
+  t = 0;
2653
+  } else if(t > document.documentElement.clientHeight - box.offsetHeight) {
2654
+  t = document.documentElement.clientHeight - box.offsetHeight;
2655
+  }
2656
+  box.style.left = l + "px";
2657
+  box.style.top = t + "px";
2658
+ }
2659
+ //鼠标抬起的函数
2660
+ document.onmouseup = function() {
2661
+  document.onmousemove = null;
2662
+  document.onmouseup = null;
2663
+ }
2664
+ //火狐浏览器在拖拽空div时会出现bug
2665
+ //return false阻止默认事件,解决火狐的bug
2666
+ return false;
2667
+  
2668
+ }
2628 2669
 		</script>
2629 2670
 		<script src="./js/plugins/metisMenu/jquery.metisMenu.js"></script>
2630 2671
 		<script src="./js/plugins/slimscroll/jquery.slimscroll.min.js"></script>