web app遇到的一些坑及小技能

        問題:手機端 click 事件會有大約 300ms 的延遲
        原因:手機端事件 touchstart --> touchmove --> touchend or touchcancel --> click,因為在touch事件觸發(fā)之后,瀏覽器要判斷用戶是否會做出雙擊屏幕的操作,所以會等待300ms來判斷,再做出是否觸發(fā)click事件的處理,所以就會有300ms的延遲

        解決方法:使用touch事件來代替click事件,如 zepto.js 的tap事件和fastClick,還有我自己也寫了個移動端手勢操作庫 mTouch,都有相應的事件可以代替click事件解決這個問題

        web app遇到的一些坑及小技能

        問題:在部分機型下(如小米4、小米2s、中興) body 設置的 font-size 是用 rem 單位的話,若其他元素沒有設置font-size,該font-size值繼承于body,則會很高概率出現(xiàn)字體異常變大的情況
        原因:估計是跟app的webview默認設置有關,body的font-size使用rem單位,就是相對于 當前根節(jié)點的font-size來確定的,可能在某些webview的設置下,body用的是webview設置的默認字體大小,因為在我給html設置 了一個px單位的默認font-size時,還是會出現(xiàn)字體異常變大的情況,具體webview的一些細節(jié)就沒有再研究了
        解決方法:body設置一個px單位的默認font-size值,不用rem,或者給字體會異常變大的元素設定一個px單位的font-size值
        問題:使用zepto的 tap 事件時會出現(xiàn)“點透”bug,比如:一個元素A綁定了tap事件,緊跟其后的元素B綁定了click事件,A觸發(fā)tap事件時將自己remove掉,B就會自動“掉”到A的位置,接下來就是不正常的情況,因為這個時候B的click事件也觸發(fā)了
        原因:因為tap事件是通過 touchstart 、touchmove 、 touchend 這三個事件來模擬實現(xiàn)的,在手機端事件機制中,觸發(fā)touch事件后會緊接著觸發(fā)touch事件坐標元素的click事件,因為B元素在300ms內(nèi)剛好 “掉”回來A的位置,所以就觸發(fā)了B的click事件,還有zepto的tap事件都是代理到body的,所以想通過 e.preventDefault()阻止默認行為也是不可行的
        解決方法:(1)A元素換成click事件;(2)使用我寫的庫 mTouch 來給A綁定tap事件,然后在事件回調(diào)中通過e.preventDefault()來阻止默認行為,或者換用其他的支持tap事件的庫
                    待續(xù)...
            一些有用技能點
                    通過設置css屬性 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);取消掉手機端webkit瀏覽器 點擊按鈕或超鏈接之類的 默認灰色背景色
                    設置css屬性 -webkit-user-select:none; 控制用戶不可選擇文字
                    區(qū)域性 overflow: scroll | auto 滾動時使用原生效果:-webkit-overflow-scrolling: touch (ios8+,Android4.0+)
        上一篇: 豬價暴漲非最大難題,區(qū)塊鏈賦能巧破行業(yè)隱患
        下一篇: APP占內(nèi)存是什么原因呢

        針對APP開發(fā)您可能感興趣

        成都app開發(fā)公司有哪些

      1. 成都APP開發(fā)公司介紹家庭食譜APP有哪些功能價值

        成都APP開發(fā)公司介紹家庭食譜APP有哪些功能價值?如今各地都有特色菜,那么想嘗試特色菜卻又不知道在哪里找,每天不知道吃什么,就很讓人犯了難,那么成都APP開發(fā)公司考慮到大眾的想......

      2. 成都APP開發(fā)公司開發(fā)APP的誤區(qū)有哪些

        成都APP開發(fā)公司開發(fā)APP的誤區(qū)有哪些?APP看起來簡單,但要完成一個app開發(fā)項目,實則需要很多步驟很復雜,有些成都APP開發(fā)公司在開發(fā)APP時,很容易陷入誤區(qū)。1.價錢越低越好,許多成都AP......

      3. 成都APP開發(fā)公司開發(fā)app需要哪些職位人員

        成都APP開發(fā)公司開發(fā)app需要哪些職位人員?關于app的開發(fā),一定需要團隊的力量,那么成都APP開發(fā)公司在開發(fā)自己的APP時,需要的專業(yè)app開發(fā)團隊必須要哪些人員呢。1.產(chǎn)品經(jīng)理。產(chǎn)品經(jīng)理......

      4. 成都APP開發(fā)公司開發(fā)電影購票app需要哪些功能

        成都APP開發(fā)公司開發(fā)電影購票app需要哪些功能?近年來,電影業(yè)發(fā)展迅速,喜歡看電影的朋友都會關注新電影的上映,成都app開發(fā)公司未來久科技開發(fā)電影購票APP不僅能觀看電影,還能購買......

      5. 成都消防APP開發(fā)公司包含哪些功能

        成都消防APP開發(fā)公司包含哪些功能?火災事故的風險在日常生活中無處不在,我們不僅需要知道應對火災的知識,還要熟知其對策,那么對于不了解這方面知識的人,未來久科技成都app制作......

      6. 成都APP開發(fā)公司開發(fā)汽車APP的功能有哪些

        成都APP開發(fā)公司開發(fā)汽車APP的功能有哪些?如今越來越多的人有自己的汽車,那么傳統(tǒng)的汽車行業(yè)可能不能滿足大眾的需求了,成都app開發(fā)公司未來久科技開發(fā)的汽車APP能夠整合數(shù)據(jù)和信息......

      7. 成都按摩椅APP開發(fā)公司功能模塊有哪些

        成都按摩椅APP開發(fā)公司功能模塊有哪些?伴隨著共享業(yè)的興起,許多共享產(chǎn)品應運而生,為整合線下按摩椅資源,緩解生活壓力,為使用者提供了良好的休息環(huán)境,成都app開發(fā)公司未來久科......

      8. 成都洗車app開發(fā)公司常見功能需求有哪些

        成都洗車app開發(fā)公司常見功能需求有哪些?伴隨著汽車數(shù)量的逐步增加,許多相關產(chǎn)業(yè)得到了發(fā)展。清洗汽車是很普遍的,但是洗車排隊也是常事。成都app開發(fā)公司未來久科技開發(fā)洗車APP為......

      9. 成都樂器app開發(fā)公司功能需求有哪些

        成都樂器app開發(fā)公司功能需求有哪些?很多時候我們都會想要玩一玩樂器,但是又沒必要專門去報班或者買些樂器,在這種情況下,未來久科技成都app制作公司開發(fā)成都樂器app,讓每一個人......

      10. 成都手機app開發(fā)公司怎么樣

      11. 成都未來久開發(fā)手機app是怎么收費

        成都未來久開發(fā)手機app是怎么收費? 如今手機APP軟件應用已經(jīng)成功滲透到我們生活中,而需要開發(fā)手機APP的企業(yè)都會非常關注這個問題:在成都企業(yè)開發(fā)一個手機APP到底需要多少錢呢?下......

      12. 未來手機APP軟件開發(fā)的方向是怎么樣的

        隨著數(shù)量增加,對手機APP軟件開發(fā)者來說,做到差異化越來越難。比如在照片分享、購物、移動聊天、本地活動、電影、新聞等手機APP軟件類別中,無論手機APP軟件開發(fā)者選擇何種領域,都......

      13. 怎么選擇一個手機APP開發(fā)公司

        開發(fā)手機APP是傳統(tǒng)公司進行品牌宣傳,拓寬銷售渠道低成本獲取用戶的重要工具。但是現(xiàn)在APP開發(fā)市場魚龍混雜,選錯開發(fā)公司不僅會給企業(yè)造成金錢和時間的損失,還會影響企業(yè)的發(fā)展進......

      14. 安卓手機app開發(fā)價格怎么計算

        網(wǎng)站客服反饋,很多企業(yè)對“安卓手機app開發(fā)價格怎么計算?”這個問題尤為關注。尤其是一些沒有找外包公司開發(fā)過APP的客戶,很多一上來直接就問價格。要知道一個開發(fā)一個app所需要的人......

      15. 創(chuàng)新創(chuàng)業(yè)查看全部

        公司動態(tài)查看全部

        立刻咨詢
        獲取方案/報價

        1對1專家顧問

        7x24咨詢熱線
        180-1134-3090

        添加客服微信
        馬上獲取方案/報價

        亚洲gv无码钙片在线观看,国产精品欧美日韩中字一区二区,亚洲国产欧美在线人成|,无码h黄肉动漫在线观看 亚洲图欧美色自拍另类 日韩中文无码中出人妻