久久无码中文字幕_日韩精品无码一本二本三_久久精品呦女暗网_欧美一级夜夜爽_久久精品国产99久久99久久久

15
2019/06

消除移動(dòng)端中300ms點(diǎn)擊延遲

發(fā)布時(shí)間:2019-06-15 10:09:19
發(fā)布者:神棍子
瀏覽量:
0

    在一般的情況下,移動(dòng)端瀏覽器監(jiān)聽點(diǎn)擊事件的時(shí)候都存在一個(gè)300ms的點(diǎn)擊延遲,也就是說,當(dāng)我們點(diǎn)擊頁面的時(shí)候移動(dòng)端瀏覽器并不是立即作出反應(yīng),而是等待一段時(shí)間才會(huì)出現(xiàn)點(diǎn)擊的效果。這個(gè)問題來自于雙擊事件,因?yàn)樵谝苿?dòng)端中存在雙擊縮放的操作,例如當(dāng)你點(diǎn)擊一個(gè)跳轉(zhuǎn)鏈接標(biāo)簽的時(shí)候,瀏覽器不能直接判斷你是想要立即跳轉(zhuǎn),還是要縮放頁面,所以就存在了一個(gè)300ms的延遲,如果在延遲內(nèi)再次點(diǎn)擊便會(huì)縮放,否則便會(huì)跳轉(zhuǎn)。


     而現(xiàn)在這300ms的點(diǎn)擊延遲就變得非常雞肋,直接就影響到了頁面之間切換的流暢性,所以就要想辦法消除這300ms的延遲


    第一種辦法就是在css中增加屬性:touch-action


        寫法:

               * {                    touch-action: none; /*當(dāng)觸控事件發(fā)生在元素上時(shí),不進(jìn)行任何操作*/                }


    直接將所有的其他手勢事件全都禁用掉,便能達(dá)到消除延遲的目的,但是這個(gè)屬性在很多瀏覽器中都存在不兼容的問題,而且當(dāng)設(shè)置完這個(gè)屬性之后,頁面的滾動(dòng)也會(huì)隨之被禁用,慎用。


    第二種辦法是在head中增加meta鏈接禁用縮放


        寫法:

                

                


    意為將頁面設(shè)置為無法縮放,所以就是禁用掉了雙擊縮放的功能,從而達(dá)到消除延遲的目的。


    以上方法在ios端都無法實(shí)現(xiàn)消除延遲的目的,fastclick便能完美兼容各種瀏覽器

        

        寫法: