1. 程式人生 > >threejs在手機端的touchmove失效。

threejs在手機端的touchmove失效。

這裡是在知乎上找到的回答:

首先要確定下你的需求具體是什麼樣的, 是要監聽整個場景的touchmove事件,還是要操作三維模型

如果是整個場景的話:

1.可以在事件捕獲階段拿到事件的target

DOM.addEventListener( 'touchmove', function(e){
     console.log(e)
}, true );  //第三個引數為true 

2.可以在外層包裹一層,監聽此層事件

如果是需要對模型操作則需要使用new THREE.Raycaster()通過射線去抓取模型進行操作



作者:lunzi
連結:https://www.zhihu.com/question/267927626/answer/331152823
來源:知乎
著作權歸作者所有。商業轉載請聯絡作者獲得授權,非商業轉載請註明出處。

原作者採用事件捕獲解決了外掛和自定義touchmove衝突的問題,後來在看orbitcontrols外掛的時候,發現外掛中的touchmove事件中,阻止了事件冒泡,導致了給場景新增touchmove的事件失效。

但我實驗時候沒有成功,我直接去了外掛中刪除了了他們的阻止事件冒泡。

相關推薦

threejs手機touchmove失效

這裡是在知乎上找到的回答: 首先要確定下你的需求具體是什麼樣的, 是要監聽整個場景的touchmove事件,還是要操作三維模型 如果是整個場景的話: 1.可以在事件捕獲階段拿到事件的target DOM.addEventListener( 'touchmove', f

手機使用rem字型自適應手機的列表一排兩個

var html = document.documentElement;var whtml  =html.getBoundingClientRect().width;    //Element.getBoundingClientRect()方法返回元素的大小及其相對於視口的

使用MUI框架,模擬手機的下拉刷新,上拉加載操作

項目應用 pan true .net 沒有 拖動 test css選擇器 query 套用mui官方文檔的一句話:“開發者只需關心業務邏輯,實現加載更多數據即可”。真的是不錯的框架。 想更多的了解這個框架:http://dev.dcloud.net.cn/mui/ 那麽如何

百度地圖手機單觸點單擊和長按事件,解決部分手機(小米手機)地圖單擊事件失效,多觸點、拖動依然觸發長按的bug

|| ble apply timeout console dto eat 問題 int /** * Author 嶽曉 * * 對百度地圖的事件擴展,目前擴展了fastclick和longclick, * 解決某些設備click不執行的問題

vue ---- 實現手機(左滑 刪除右劃 正常)

四種 ber prev 屬性 .html 綁定 .com htm 左右 touchstart: // 手指放到屏幕上的時候觸發 touchmove: // 手指在屏幕上移動的時候觸發 touchend: // 手指從屏幕上拿起的時候觸發

css設定多行超出變省略號,適用於手機

 width: 200px;     word-break: break-all;     text-overflow: ellipsis;     display: -webkit-box; /** 物件作為伸縮

touchstart, touchmove, touchend, mousedown, mousemove, mouseup, 手機和pc端點選及觸控事件

touchstart事件:當手指觸控式螢幕幕時候觸發,即使已經有一個手指放在螢幕上也會觸發。 touchmove事件:當手指在螢幕上滑動的時候連續地觸發。在這個事件發生期間,呼叫preventDefault()事件可以阻止滾動。 touchend事件:當手指從螢幕上離開的時候觸發。 to

手機呼叫介面獲取圖片路徑帶有中文名稱不能獲取的問題

問題原因: 手機端呼叫介面獲取圖片路徑帶有中文名稱不能獲取的問題。   http://.../../圖片名字.jpg 解決辦法 在tomcat的server.xml中加入URIEncoding="utf-8"   <Connector

android開發,伺服器返回的字串超長,手機讀取字串報錯的問題

問題描述: 手機端做個通訊錄,一次性讀取服務端的所有人員通訊列表,字串超長; 服務端程式碼: PrintWriter writer = null;JsonElement je = null;try {writer = response.getWriter();} catch

手機觸控touchmove 關閉預設事件和開啟預設事件

<head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1.0,maximum-scale=1.0,minimum-sca

手機的viewport屬性

手機端 a標簽 不同的 屬性控制 when 否則 進行 user spl Window.devicePixelRatioThis read-only property returns the ratio of the resolution in physical pixel

0512日重點:淘寶的H5手機自適應解決方案:Flexible

自動獲取 手機端 issue 解決方案 target 解決 flex get bsp 參考文檔: https://github.com/amfe/lib-flexible https://github.com/amfe/article/issues/17 自我總結:F

ionic中<ion-scroll>設置為左右滾動,蘋果手機觸摸到此標簽上時無法上下滾動內容

direct lin 滾動 direction eat lists -s over hidden ionic中<ion-scroll>設置為左右滾動,蘋果手機端觸摸到此標簽上時無法上下滾動內容。 如下代碼: <ion-scroll direction="x

PC變成手機的時候,把特效去掉(把canvas標簽去掉)

window 方法 spa color win css display screen span PC端變成手機端的時候,把特效去掉(把canvas標簽去掉)<script> if (screen.width < 768){ $(‘can

手機頁面自適應解決方案—rem布局

syn posit var cells document false 為什麽 gin element 只需在頁面引入這段原生js代碼就可以了 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 (function (doc

js判斷手機訪問跳轉到手機

turn -1 phone lac ice 情況 follow linu 手機端 <SCRIPT LANGUAGE="JavaScript"> function mobile_device_detect(url) { var thisOS=navi

zabbix增加手機4個url地址的返回值

curl zabbix url 由同事提供4個需要監控的url地址GET類型:http://10.15.24.61:809/UserCenterService.svc/getAccountInfo/563/9638POST類型:http://10.15.24.61:809/ProductServi

html 手機click 事件延遲問題(fastclick.js使用方法)

cat 設計 fun 等待時間 get click tla 調用 span 下載地址: fastclick.js 為什麽存在延遲? 從點擊屏幕上的元素到觸發元素的 click 事件,移動瀏覽器會有大約 300 毫秒的等待時間。為什麽這麽設計呢? 因為它想看看

html 手機click 事件去掉黑色陰影效果

phone asc 一個 ios pad tap 背景 ipa 就會 添加css樣式 html{-webkit-text-size-adjust: 100%;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);} 1、 -web

線纜測試,手機程序說明

das line 藍牙 依次 文件 偏移量 一位 測試數據 dash 總體功能: 1.手機APP通過藍牙連接到測試設備。 2.通過藍牙發送48字節十六進制數。 3.通過藍牙接收48字節十六進制數。 4.分析48字節十六進制數,生成文本文件。 5.文本文件的管理。