文章詳情頁
css3 - 微信前端頁面遇到的transition過渡動畫的bug
瀏覽：157日期：2022-06-25 09:02:37
問題描述
在做一個微信移動端頁面的時候遇到這么個問題，簡單描述一下，就是：頁面左側(cè)有一個側(cè)滑菜單，我需要實現(xiàn)菜單滑出來之后，頁面內(nèi)容左邊增加內(nèi)部白，相當于頁面寬度壓縮一部分。現(xiàn)在效果是，如果頁面中文字太多，菜單滑出來之后文字不會自動換行，直接超出后隱藏了的效果。我想實現(xiàn)文字也會自動換行，不知該如何解決。
問題描述有點啰嗦，直接給出demo鏈接吧（掃碼可以再微信上看效果）：transition過渡動畫bug
補充一下效果截圖對比。
chrome上的效果，圖片文字都沒問題
微信上面效果，圖片沒問題，但是文字沒有自動換行。
這個bug只有在微信內(nèi)置瀏覽器或Android Browser才會出現(xiàn)，測試chrome和蘋果上沒有問題，請問如何解決？
ps:微信內(nèi)置瀏覽器內(nèi)核是使用的操作系統(tǒng)瀏覽器內(nèi)核吧？
問題解答
回答1：微信使用的是X5內(nèi)核吧
回答2：代碼沒有問題，p元素也沒有設(shè)置高度，估計還是和x5 webview有關(guān)。ps:基于webview開發(fā)頁面很多坑
回答3：我覺得這種問題，就是騰訊X5內(nèi)核的問題，對一些css3的解析不符合標準？不想糾結(jié)了。
回答4：加上背景~應該可以
標簽：
微信
相關(guān)文章：
1. javascript - JS如何取對稱范圍的隨機數(shù)？2. java - ehcache緩存用的是虛擬機內(nèi)存么？3. 數(shù)據(jù)庫 - mysql如何處理數(shù)據(jù)變化中的事務？4. android - java 泛型不支持數(shù)組，那么RxJava的Map集合有什么方便的手段可以定義獲得一串共同父類集合數(shù)據(jù)呢？5. java - mongodb分片集群下，count和聚合統(tǒng)計問題6. 關(guān)于docker下的nginx壓力測試7. 服務器端 - 采用nginx做web服務器，C++開發(fā)應用程序 出現(xiàn)拒絕連接請求？8. javascript - 有什么兼容性比較好的辦法來判斷瀏覽器窗口的類型？9. dockerfile - 我用docker build的時候出現(xiàn)下邊問題 麻煩幫我看一下10. python - pandas按照列A和列B分組，將列C求平均數(shù)，怎樣才能生成一個列A,B,C的dataframe
排行榜
熱門標簽
網(wǎng)公網(wǎng)安備