zoukankan      html  css  js  c++  java
  • uniapp全局可拖动悬浮球

    yuanqiu(){
    var that=this;
    var kuan=375
    var gao=667
    uni.getSystemInfo({
    success: function (res) {
    kuan=res.windowWidth
    gao=res.windowHeight
    }
    });
    var view = new plus.nativeObj.View('yspc',
    {top:'66%',left:(kuan-70)+'px',height:'54px','54px',dock:'right',opacity:0.5},
    [
    {tag:'rect',id:'rect',color:'#3D92FB',rectStyles:{radius:"54px"},position:{top:'0px',left:'0px','100%',height:'54px'}},
    {tag:'img',id:'img',src:'_www/static/xyyth.png',position:{top:'6px',left:'14px','26px',height:'26px'}},
    {id:'wula',tag:'font',text:'00:01',RectStyles:{radius:"30px"},textStyles:{size:'12px',color:"#FFFFFF"},position:{top:'28px',left:'0px','100%',height:'20px'}}
    ]);
    view.drawRect({color:'rgba(0,0,0,0)',borderWidth:'0px',radius:'30px'},
    {top:'0px',left:'0px','100%',height:'100%'});
    view.show();
    var xxx=0
    var yyy=0
    var xxx0=0
    var yyy0=0
    view.addEventListener("touchstart", function(event){
    //console.log(event)
    xxx= event.clientX
    yyy=event.clientY
    xxx0=event.pageX
    yyy0=event.pageY
    //view.setStyle({opacity:1});
    if(that.chuinter){

    clearInterval(that.chuinter)
    }

    that.chunum=0
    // console.log(that.chunum)
    that.chuinter= setInterval(function(){
    that.chunum++
    //console.log(that.chunum)
    },100)
    }, false);
    view.addEventListener("touchend", function(event){
    //console.log(event)
    //console.log(that.chunum)
    //console.log(Math.abs(event.pageX-xxx0))
    //console.log(Math.abs(event.pageY-yyy0))
    if(Math.abs(event.pageX-xxx0)<5&&Math.abs(event.pageY-yyy0)<5&&that.chunum<4){
    console.log('跳页')
    }
    if(that.chuinter){
    clearInterval(that.chuinter)
    }
    that.chunum=0

    }, false);
    // view.setStyle({opacity:1});
    view.addEventListener("touchmove", function(event){
    //console.log(event)

    if(event.screenX-xxx>kuan-74){
    var xkuan=kuan-74
    }else if(event.screenX-xxx<=0){
    var xkuan=0
    }else{
    var xkuan=event.screenX-xxx
    }
    if(event.screenY-yyy>gao-60){
    var xgao=gao-60
    }else if(event.screenY-yyy<=0){
    var xgao=0
    }else{
    var xgao=event.screenY-yyy
    }

    view.setStyle({
    top: xgao + 'px',
    left: xkuan+ 'px'
    });


    }, false);
    /*var ss=0
    var vinter= setInterval(function(){
    ss++
    view.draw([
    {id:'wula',tag:'font',text:ss,RectStyles:{radius:"30px"},textStyles:{size:'12px',color:"#FFFFFF"}}
    ]);
    },1000)
    setTimeout(function(){
    view.close();
    clearInterval(vinter)
    },5000)*/
    },

  • 相关阅读:
    Postman生成随机数(4)
    Postman参数化(3)
    Postman主界面介绍(2)
    Postman安装与介绍(1)
    Scuba数据库漏洞扫描工具--安装与使用
    Jmeter(八)Linux上安装与使用
    Jmeter(七)生成测试报告(Windows)
    理解动态字符串SDS
    csp复习笔记?
    ORM
  • 原文地址:https://www.cnblogs.com/jyc226/p/15637012.html
Copyright © 2011-2022 走看看