專案中遇到的相容問題總結

2022-03-07 20:27:39 字數 1114 閱讀 8572

1.在firefox瀏覽器 draggable=false 不起作用的問題

2. svg在firefox瀏覽器無法顯示問題和繪製到canvas的問題 

需要使用encodeuricomponent  解決image的src源設定為svg顯示格式為data:image/svg+xml;utf8,的無法顯示問題!

svg節點設定width和height,解決image設定同樣的src格式無法繪製到canvas的問題!

3. 設定z-index為最大值將其置為最頂層且高於全屏的元素,但是只在chrome中有效(

有時在全屏狀態下,要點選按鈕有彈框出現,然而瀏覽器的z-index最大為:2147483647

z-index最大值:

ie firefox safari的z-index最大值是2147483647 。

opera的最大值是2147483584.。

ie safari opera在超過其最大值時按最大值處理。

firefox 在超過最大值時會資料溢位正負不定,但有一點可以肯定絕對不會高於2147483647層

最小值

ie firefox safari的z-index最小值是-2147483648

opera的z-index最小值-2147483584

firefox在-2147483648<=z-index<0時層不顯示 在z-index<-2147483648時溢位實際數字正負不定

ie safari opera在z-index<0時顯示,在小於其最小值時都按其最小值處理

等值時表現

各個瀏覽器當兩個層z-index相同時,按網頁**中層出現的順序,後出現的層高於先出現的層。

跨瀏覽器永遠最大:2147483647

跨瀏覽器永遠最小:hack(」ie,safari,opera」:-2147483648,」firefox」:0)

這時如果用z-index來實現將會有瀏覽器問題。

解決方案是 :利用繼承,將要彈框的內容寫在全屏的內容裡面。這時全屏情況下,將要彈框的內容的層級也會繼承過來,z-index的效果將相對於全屏狀態下!!!

4. 設定360瀏覽器預設使用極速模式 

專案中遇到的問題總結

一 cookies方面 1 無法刪除cookies 參考 二 npm 在使用node的時候,用npm安裝了很多軟體,過一段時間沒有使用就會忘記,怎麼檢視自己全域性安裝過的包,用命令 npm list g depth 0三 cmd 切換磁碟 四 vscode 1 摺疊 cmd option 摺疊滑鼠所...

專案中遇到的相容性問題

1 瀏覽器撥打 問題 場景 使用標籤 tel 協議,一鍵撥打 功能下,正對含有分機號的情況,通常是撥打分機號後需以 結束,或者不識別 解決方案 經查證瀏覽器解析該字元是會進行轉碼成16進製制字元,經實踐,將 字元寫成 23 在使用h5中一鍵撥打 tel 協議時可以正常除。示例 var tel 400...

最新相容問題總結

相容問題解決方案。1 在做 之前,先把下邊三句meta加入頁面。2 pc端相容瀏覽器不能用 html5 新增的標籤。3 偽元素也不能用,在移動端可以用。4 如果想針對某乙個瀏覽器,設定單獨的屬性值,可以 如 class 針對 ie7特製識別的 css樣式 html class 針對ie8特製識別的c...