如何解決小程序畫布canvas隱藏的問題

發(fā)布時間：2021-01-18 14:23:41 來源：億速云閱讀：753 作者：小新欄目：移動開發(fā)

這篇文章給大家分享的是有關(guān)如何解決小程序畫布canvas隱藏的問題的內(nèi)容。小編覺得挺實用的，因此分享給大家做個參考，一起跟隨小編過來看看吧。

相信有很多時候,大家都會遇到要利用 canvas畫布生成圖片的時候.
當然我也遇到了, 在項目中wxml頁面中生成的canvas之后,我發(fā)現(xiàn)怎么樣給canvas標簽加css都無法讓canvas不影響到頁面,

  <canvas    style="opacity:0;position:fixed;z-index:-9999;">
    // 無論是opacity  還是  z-index 都無法解決,多多少少會影響
   </canvas>

幾番琢磨,想出以下解決方案: 在canvas外層加父標簽,再控制父標簽的顯示

<view  style="width:0px;height:0px; overflow:hidden"> //讓父標簽 0寬 0高 隱藏溢出
    <canvas >
    </canvas>
</view>

如果上述不行請看下面這個:

  <canvas style="position:fixed:left:9999px" >
// 直接讓canvas 飛到天際,  簡單粗暴;   使用時注意 position的問題; 如果 fixed不行, 換其他定位試試
    </canvas>

感謝各位的閱讀！關(guān)于“如何解決小程序畫布canvas隱藏的問題”這篇文章就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，讓大家可以學到更多知識，如果覺得文章不錯，可以把它分享出去讓更多的人看到吧！

向AI問一下細節(jié)

猜你喜歡