From 58f31dcefe8d55fd4b71175942eeddedbc1b6553 Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Mon, 10 May 2021 16:22:47 +0800
Subject: [PATCH] 小程序地图
---
public/xcxh5map/js/move.js | 47 +++++++++++++++++++++++++++++++++--------------
1 files changed, 33 insertions(+), 14 deletions(-)
diff --git a/public/xcxh5map/js/move.js b/public/xcxh5map/js/move.js
index 2b1aaf5..c05cb49 100644
--- a/public/xcxh5map/js/move.js
+++ b/public/xcxh5map/js/move.js
@@ -1,4 +1,5 @@
-function myDomMove(dom,div, map) {
+// 使用说明：（需要移动的dom，触摸块dom，跟随改变map dom）
+function myDomMove(dom, div, map) {
this.m = $(dom);
this.div = $(div);
this.mapId = $(map);
@@ -10,10 +11,8 @@
this.__dy = null;
this.mapH = null;//地图高度
this.__wy = null;//屏幕高度
- this.state = 'down';//dom状态
- this.con = () => {
- console.log(this.m);
- }
+ this.state = "up";//dom状态默认up
+
this.getMosePosition = (x, y) => {//获取鼠标位置
this.__sx = x;
this.__sy = y;
@@ -46,10 +45,13 @@
//begin
- this.followFinger = (map) => {
+ this.followFinger = (map, state = 14) => {//(地图实例，dom状态判断是向上还是向下)
console.log('开始跟随手指');
var that = this;
-
+ if(state != 14){
+ that.state = state;
+ console.log(that.state);
+ }
that.getDomPosition();//获取dom位置
that.getMapHeight();//获取地图高度
var once = true;
@@ -57,22 +59,23 @@
e = e || window.event;
that.__xx = e.touches[0].clientX;
that.__yy = e.touches[0].clientY;
- if (once) {
+ if (once) {//获取第一次点击的位置
once = false;
that.getMosePosition(that.__xx, that.__yy);
}
// console.log(that.__yy, '鼠标');
- var h = that.__yy - that.__sy
+ var h = that.__yy - that.__sy//鼠标移动距离y
if (that.state == 'down') {//两种模式
console.log(that.state);
if (h >= 0 && h + that.__dy <= that.__wy - 20) {
that.changeDomPosition(0, h, h + that.__dy);//改变位置
+ console.log(that.state,h + that.__dy,112);
}
} else if (that.state == 'up') {
- console.log(that.state);
if (h >= -that.__dy && h <= that.__wy - 20) {
that.changeDomPosition(0, h, h + that.__wy - 20);//改变位置
+ console.log(that.state,h + that.__wy - 20,112);
}
}
@@ -85,24 +88,40 @@
var chous = Math.abs(that.__yy - that.__sy) > that.__wy / 4;
}
if (chous) {
- that.changeDomPosition(0, 0, that.__dy);//改变位置
+ that.changeDomPosition(0, 0, (parseFloat(that.__wy / 10) * 3.999));//改变位置
// that.getDomPosition();//抬起获取dom位置/持续停留使用
that.state = 'down';
$('#map').css("height", (index, value) => {//改变地图高度
return '50%';
})
- map.invalidateSize(true);
+ map.invalidateSize(true);//应用地图高度
} else {
- that.changeDomPosition(0, 0, that.__wy - 20);//改变位置
+ that.changeDomPosition(0, 0, that.__wy - 50);//改变位置
// that.getDomPosition();//抬起获取dom位置/持续停留使用
that.state = 'up';
$('#map').css("height", (index, value) => {//改变地图高度
return '100%';
})
- map.invalidateSize(true);
+ map.invalidateSize(true);//应用地图高度
}
that.getMapHeight();//抬起获取map高度
});
}
+ this.destruction = () => {//初始化销毁
+ this.m = $(dom);
+ this.div = $(div);
+ this.mapId = $(map);
+ this.__xx = null;//鼠标实时位置
+ this.__yy = null;
+ this.__sx = null;//鼠标开始位置
+ this.__sy = null;
+ this.__dx = null;//dom位置
+ this.__dy = null;
+ this.mapH = null;//地图高度
+ this.__wy = null;//屏幕高度
+ this.state = "up";//dom状态默认up
+ this.div.off();
+ }
}
+
// export default myDomMove;
\ No newline at end of file
--
Gitblit v1.9.3