移動Safari瀏覽器媒體查詢問題

所以我想做一個基本的電話號碼交換，所以這個號碼是可以點擊移動但不是桌面。移動Safari瀏覽器媒體查詢問題

我一直在用下面的代碼（主要是針對iphone）：

CSS

#phone .mobile { 
    display: none; 
} 

@media only screen and (max-device-width: 640px) and (min-device-width: 320px) { 

    #phone .mobile { 
     display: inline; 
    } 

    #phone .desktop { 
     display: none; 
    } 

}

頭（從h5bp使用）

<meta name="viewport" content="width=device-width, initial-scale=1">

Chrome和Opera Mini的工作很好，但Safari瀏覽器顯示兩個數字。我注意到Safari讓所有的電話號碼可點擊。這可能與它有關嗎？

來源

2013-08-21 zebapy

可以用一些JavaScript/jquery的

1）檢查窗口寬度 2）如果這是超過一定量的像素的多個實現這一點，則可以輸出而不HREF的鏈路，否則添加電話：39000000或任何:)

僑法比奧

來源

2013-08-21 15:36:18

這是一個變通辦法，但如果我跑成什麼這個問題與另一個響應元件的一個好主意？ – zebapy

這個問題遇到的問題越多，那麼您就應該考慮兩個不同的應用程序，一個用於移動應用程序，一個用於桌面應用程序。如果你有相同的內容（顯然不同的CSS），創建一個通用的解決方案纔有意義。但是，如果你開始有幾個例外，好吧，我想沒有什麼可以做的......這與通用應用程序的想法是背道而馳的...... –

這不是我的決定。除電話號碼外，我們的網站尚未進行移動優化。我試過javascript解決方案，但現在iPhone上的Chrome瀏覽器沒有觸發檢查窗口大小小於或等於640.什麼給？ – zebapy

移動Safari瀏覽器媒體查詢問題

回答

相關問題