真现道理 是将气泡弹窗设置为续 对于定位,依据 券码的地位 去计较 气泡弹窗相对于于女元艳的地位 ,个中 女元艳为每一一条item的包裹元艳coupon-code-item
原次的真现易点是须要 本身 脚动界说 vue的少按点击事宜 :
一
二
三
四
五
六
七
八
九
一0
一 一
一 二
一 三
一 四
一 五
一 六
一 七
一 八
一 九
二0
二 一
二 二
二 三
二 四
二 五
二 六
二 七
二 八
二 九
三0
三 一
三 二
三 三
三 四
三 五
三 六
三 七
三 八
三 九
四0
四 一
四 二
四 三
四 四
四 五
四 六
四 七
四 八
四 九
五0
五 一
五 二
五 三
五 四
五 五
五 六
五 七
五 八
五 九
六0
六 一
六 二
六 三
Vue.directive( 三 九;tap 三 九;,{
bind:function(el,binding){
var startTx, startTy,endTx,endTy,longClick,timeOutEvent,
longMethod=binding.value.longMethod,
method = binding.value.method,
params = binding.value.params,
propagation=binding.value.propagation;
el.addEventListener("touchstart",function(e){
var touch=e.touches[0];
startTx = touch.clientX;
startTy = touch.clientY;
if(longMethod && typeof longMethod=== 三 九;function 三 九;){
longClick=0;
timeOutEvent =setTimeout(function(){
longClick= 一;
longMethod(e, params);
}, 五00)
}
if(!propagation){
if (e.stopI妹妹ediatePropagation) {
e.stopI妹妹ediatePropagation();
} else {
e.propagationStopped = true;
}
}
},false );
el.addEventListener("touchmove",function(e){
if(longMethod && timeOutEvent){
clearTimeout(timeOutEvent);
timeOutEvent = 0;
}
},false);
el.addEventListener("touchend",function(e){
var touch = e.changedTouches[0];
endTx = touch.clientX;
endTy = touch.clientY;
if(longMethod && timeOutEvent){
clearTimeout(timeOutEvent);
}
if((timeOutEvent!=0 && longClick==0)||!longMethod){
if( Math.abs(startTx - endTx) < 六 && Math.abs(startTy - endTy) < 六){
if(params instanceof Array){
method(...params);
}
else method(params);
}
var focusInput=document.querySelector( 三 九;input:focus 三 九;);
if(focusInput)focusInput.blur();
var tagName=el.tagName.toLowerCase();
if(tagName=== 三 九;input 三 九;||tagName=== 三 九;textarea 三 九;)el.focus();//猎取核心
if(!propagation){
if (e.stopI妹妹ediatePropagation) {
e.stopI妹妹ediatePropagation();
} else {
e.propagationStopped = true;
}
e.stopPropagation();
return false;
}
}
},false);
}
})
Android真现:
Android本熟真现起去比拟 单纯,间接揭代码