關於移動端點擊後出現閃或者黑色背景

在點擊某些帶事件的DOM後,出現瞬間的閃動,a標籤點擊的時候還是出現黑色的背景。首頁,瞬間的閃動是怎麼出現的,具體原因不是很明確,根據我測試,貌似是因爲DOM中有可選擇的文字,使得DOM是可以整體被touch,在ipad中,元素被touch後會出現高亮,就是出現半透明的黑色背景..於是當我們每次點擊的時候,就會出現看到瞬間的閃動。那邊我們就要對touch和click事件做一下處理.

  1.  $("#id").bind("touchstart click",function(e){  
  2.     e.stopPropagation()  
  3.     if(e.originalEvent.touches){  
  4.         //touch事件處理  
  5.         return false;  
  6.     }else{  
  7.        // click事件處理  
  8.      }  
  9.   
  10. })  

上面只是簡單的處理判斷是否爲touch,如果是,則執行touch不支持click,因爲ipad上當手指觸摸的時候,即執行click也會執行touch。上訴的只是一個簡單處理方式,更好的處理方式,我們應該判斷客戶端來源信息,判斷其是否爲移動設備端。然後對其相應的事件進行綁定。
上面的至少解決的一部分的背景黑色的高亮。對a標籤是無效的。那麼a標籤如何處理呢?
關於a標籤: 我們只能用即方便又省事的CSS3來處理

  1. .class{  
  2.      -webkit-tap-highlight-color:transparent;  
  3.  }  

將其設置成透明,解決!

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章