首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

第127天:移动端-获取触摸点的位置

一、移动端轮播图滑动 1、先获取手指在轮播图元素上的滑动方向(左右) (1)手指触摸开始时记录手指所在的坐标X (2)获取界面上的轮播图容器 var $carousels=$('.carousel')...next':'prev'); javascript代码 1 //移动端轮播图滑动 2 3 //1、先获取手指在轮播图元素上的滑动方向(左右) 4 //手指触摸开始时记录手指所在的坐标...next':'prev'); 40 41 42 43 } 二、移动端获取触摸点的方式说明 1.touchstart事件        手指头触摸屏幕上的事件 2.touchmove...touchstart、touchmove、touchend三种事件下的鼠标位置点获取: (1)touchstart事件下获取:e.originalEvent.targetTouches[0].pageX...[0],所以位置.pageX .pageY就ok了 (2)touchend事件的获取:e3.originalEvent.changedTouches[0].pageX 下面是其他的一些介绍: 每个Touch

1.5K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    CVPR实时移动端检测场景竞赛:字节跳动绝对优势夺冠

    近期,来自字节跳动智能创作团队的 ByteScene 团队在 MAI 2021 实时移动端场景检测项目上,以 163.08 分的绝对优势夺得冠军。...竞赛结果及相关报告见:https://arxiv.org/pdf/2105.08819.pdf 竞赛项目介绍 MAI 2021 实时移动端场景检测竞赛:基于 RGB 图像的实时高性能移动端场景类别预测,...任务要求在移动端硬件上对摄像头输入的图像实时预测出其场景类别,总共有 30 个场景类别。...团队成绩:来自字节跳动智能创作团队的 ByteScene 团队以 163.08 分的绝对优势夺得冠军。...字节跳动的 ByteScene 团队使用迁移学习的方法训练大模型和移动端小模型,并使用迁移后的大模型对过滤后的额外数据打上伪标签,利用这些额外数据和原有训练集训练出了移动端高效且高准确率的场景检测算法。

    36910

    绝对定位bottom值为0的位置问题

    有一个position值为absolute的div,他的祖先元素里没有任何定位属性,或者他的父元素就是body。 当这个div的bottom值为0的时候,他应该被定位到哪个位置?...现在条件稍微修改一下,给body和html一个height的值,给大一些,就10000px吧。 现在这个div的位置应该在哪?...DOCTYPE html> 绝对定位bottom值为0的位置问题-caihong.cc *{...应该不少同学都知道这个表现,我问过几个朋友,他们也知道绝对定位的元素bottom为0的时候会定位到屏幕底部。但是细问原理的时候都没能讲出来。 为什么他没有定位到文档的最底部?...传送门 这一条刚入门的时候就知道,绝对定位的元素相对于他的包含块位移。现在的问题是div的包含块是谁,于是我继续去扒包含块。

    2.2K60

    【移动端网页布局】移动端网页布局基础概念 ⑧ ( 移动端页面布局方案 | 单独制作的移动端页面 - 主流 | 响应式页面兼容移动端 - 开发难度较大 )

    一、移动端页面布局方案 移动端页面方案 : 单独制作的移动端页面 : 主流开发方案 , PC 端 与 移动端 访问的是不同的页面 , 目前的 京东 / 淘宝 等电商网站移动端页面采取的该方案 ; 响应式页面兼容移动端...: 开发难度较大 , PC 端与移动端访问的是相同的页面 ; 1、单独制作的移动端页面 通过设备类型判断要加载的网页类型 , 一般会在域名前添加 m 打开移动端 , 如京东域名为 jd.com , 使用...m.jd.com 可以访问其移动端页面 ; 如京东商场 , 在浏览器中输入 https://www.jd.com/ 域名 , 进入的是 PC 端的网页 , 在浏览器中 , 按 F12 进入调试模式..., 选择手机设备调试 , 输入 https://www.jd.com/ 域名 , 会自动跳转到 https://m.jd.com/ 手机端页面中 , 京东后台会认为是移动设备请求页面 , 自动跳转到移动端页面...; 2、响应式页面兼容移动端 响应式页面兼容移动端 的原理是 通过 判断当前的 屏幕宽度 , 改变当前的页面样式 , 适应不同的设备 ; 如果不断地缩小浏览器的窗口的宽度 , 网页会不停地自适应修改布局

    3.8K40

    移动端的那些坑

    Andriod 针对部分浏览器非预期的缓存机制,需要服务端添加如下HTTP头信息: ?...但是这种做法会取消掉浏览器其他的默认行为,比如页面默认的滚动。。。...scroll 相关的方法,参考:https://drafts.csswg.org/csso… polyfill:https://github.com/iamdustan/… 综合问题 禁止页面滑动 当你需要禁止移动端页面滑动的时候...1、mask 2、banner 3、fixed 4、sticky 点透 移动端的 click 触发顺序是touchstart->touchmove->touchend->mousedown->mousemove...在重叠的区域里,被遮盖的元素绑定click,遮盖的元素绑定touch事件,且touch后遮盖的元素会隐藏的话,就会造成穿透,因为click是在touch之后延迟触发的,浏览器会误认为是在遮盖的元素上触发了

    1.8K30

    腾讯位置服务打车乘客端小车平滑移动-安卓篇

    今天我们来揭开它神秘的面纱 准备工作 实现此功能还是需要腾讯位置服务全家桶:腾讯导航SDK、腾讯地图SDK、腾讯定位SDK、腾讯司乘同显SDK,具体权限的开通需要去lbs.qq.com的官网控制台,去操作另外具体...files('libs/TencentLocationSDK_v8.4.14_ra0311232_20200103_125837_release.aar') // 司乘同显乘客端sdk,可以从腾讯位置服务中心官网...[16228857347642.jpg] 根据上述流程图的展示,我们知道要实现小车的平滑移动,需要不断的获取司机的最近几秒内点和当前路线。...具体过程是当司机开始司乘同显时,会通过司乘同显SDK同步路线和最近几秒的GPS点,不断的轮训这样我们就可以展示小车在地图上的平滑移动了。...points, //marker 是否会根据传入的点串计算并执行旋转动画, marker 方向将与移动方向保持一致

    91041

    银行的移动端应用

    一、移动端技术发展简介 本文讨论的银行移动端应用主要指手机银行,手机银行是银行对渠道端技术发展的一种适应,每次移动应用开发技术的升级也自然带来手机银行技术的升级。...手机银行曾经采用过的移动客户端开发技术包括STK、BREW、WAP、JAVA等[1]。...截至2019年5月,工行四大APP“三融一活”移动端用户规模突破4亿户,累计月活跃客户(MAU)突破1亿户,成为全球首家移动端MAU破亿的银行[15]。...(三)技术能力对移动端争夺依然具备决定性影响 随着5G、API、开放银行等技术的发展和理念的变化,移动端对于银行获客、留客、活客的意义越来越大,不仅C端,B端移动化办公的需求也越来越高。...[15]引自《工行移动端月活跃客户破亿 确立移动端领跑态势》,2019-06-03,中国电子银行网。

    1.7K20

    基于iframe的移动端嵌套

    需求描述 上上周接到了新的项目,移动端需要做一个底部有五个导航,点击不同的导航页面主体显示不同的页面,其中两个页面是自己做,而另外三个页面是引用另外三个网址,其中两个网址为内部项目,另外一个为外部(涉及跨域...问题 考虑再三后最省时间成本的就是使用iframe,虽然在移动端使用,我的内心是很拒绝的,不过其他方案调研了下都不太符合现状。...外部的页面使用width=device-width,而引用的其中一个页面的width=640,这导致那个页面渲染的时候无法全屏缩小 3.ios下其中的一个页面莫名其妙的扩大 4.iframe的页面a...标签的锚点失效 5.当我点击a加载了a的iframe页面,在切换到b,这个时候b页面字体莫名的变大 6.导航栏有个样式要求,active的时候icon是为红色的icon,其他状态下则为灰色的。...3.ios下其中的一个页面莫名其妙的扩大 经排查我发现对于标题这类的设置了white-space:nowrap, 以及iframe页面用了swiper设置的宽度为100%,而移动端为了自适应body也设置的为

    3.7K60

    移动端常用的meta总结

    声明viewport视口 viewport对于移动端设备来说非常的重要,用于定义视口的各种行为。...其中最为重要的就是要设定一个展示页面的宽度width=device-width,如果我们不设置的话,width默认的值是980PX,假设我们当前用的是IPHONE 5来访问H5页面,IPHONE 5本身的宽度只有...这种方式用户的体验度会非常的差,所以我们设定width=device-width,意思是当前设备屏幕有多宽,那么就按照多宽来渲染页面,这样就不会出现需要靠缩小或者左右移动来看完整个页面了。...,但在具体的业务场景中,有些时候这是不必须的,所以你可以关闭电话自动识别,然后在需要拨号的地方,开启电话呼出和短信功能。...一般来说我们的ICON的尺寸是114x114。

    1.1K30

    移动端学习AI的线路

    对于大部分有几年工程经验的移动端开发来说,大学的这些知识已经生疏了,要想学AI这些生疏的知识是比较严重的阻碍。...这个问题其实可以绕过去,对于移动端开发来说,如果只是想达到"能够理解并开发AI"的程度,只需要补充几个基础的知识点就够。...当然如果想要有完整的AI知识体系,除了高等数学,矩阵数学,统计学也需要好好学习一下。 下面根据开发经验,列了一个适合移动端工程师学习AI的线路。...Step 2: AI模型落地到移动端 Step 2 是一个和AI本身关心不大的步骤,仅为移动工程师设计的。这个阶段只涉及一小部分的 AI 开发,包括模型固化和落地。...Step 5: 模型优化 模型优化是一个移动端工程师几乎是必备的技能,对于一些涉及用户隐私的数据,目前是不允许传到服务端进行运算的,必须落地模型到移动端进行本地推理。

    73350

    Swiper在移动端的用法

    最近在做移动端方面运用到了饿了么的vue前端组件库,因为不想单纯用组件而使用它,故想深入了解一下实现原理。...本文主要为大家详细介绍了移动端效果之Swiper的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能帮助到大家。 1....核心解析 2.1 页面初始化 由于所有页面都在手机屏幕左侧一个屏幕宽度的位置,因此最开始的情况是页面中看不到任何一个子页面,所以第一步应该设置应该显示的子页面,默认情况下defaultIndex:0 function...// 绝对Y坐标(相对于文档顶部 clientY) }; 那么我们就可以通过开始和滑动中的信息来计算出一些东西: 滑动的水平位移(offsetLeft = currentLeft – startLeft...dragging = false; dragState = {}; 总结 整体来说实现原理还是比较简单的,滑动开始记录初始位置,计算上一页与下一页的应该展示的页面;滑动中计算位移,计算上一页下一页的位移

    83130
    领券