微信小程序-swiper輪播圖圓角滑動會先直角再圓角的解決辦法

項目中,輪播圖原本的直角覺得不夠美觀,于是設(shè)置了圓角border-radius: 10rpx;,但是會出現(xiàn)一個bug就是,滑動過程中先顯示的直角,等滑動一整張之后才會變成圓角。

這個問題真的是苦惱了半天呢,因為在父級上設(shè)置了overflow: hidden;然而在iOS真機(jī)上并不買賬~

1、首先在輪播圖的最外層,先設(shè)置好圓角,也就是top_img這個view的樣式

2、然后在swiper樣式上設(shè)置ovewflow:hidden;border-radius:10rpx;

很多百度出來的結(jié)果都是這樣解決的,我不明白,難道只有我的iOS真機(jī)上不好用嗎?

關(guān)鍵:在swpier樣式設(shè)置上除了 ovewflow:hidden;border-radius:10rpx;還要再加上很重要的一個: transform: translateY(0);

加上這關(guān)鍵一句之后,問題才得以解決!趕快記錄下來,希望可以幫助到跟我遇到相同問題的伙伴們

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 一、CSS入門 1、css選擇器 選擇器的作用是“用于確定(選定)要進(jìn)行樣式設(shè)定的標(biāo)簽(元素)”。 有若干種形式的...
    寵辱不驚丶?xì)q月靜好閱讀 1,729評論 0 6
  • 1、屬性選擇器:id選擇器 # 通過id 來選擇類名選擇器 . 通過類名來選擇屬性選擇器 ...
    Yuann閱讀 1,753評論 0 7
  • Mobile Web Favorites 參與貢獻(xiàn) 移動前端開發(fā)收藏夾,歡迎使用Issues以及 Pull Req...
    柴東啊閱讀 957評論 0 2
  • 1、垂直對齊 如果你用CSS,則你會有困惑:我該怎么垂直對齊容器中的元素?現(xiàn)在,利用CSS3的Transform,...
    kiddings閱讀 3,299評論 0 11
  • 本文為搬運貼,好帖子還是怕blog失效,多一份分享 資料保存更長久。 iOS 高效添加圓角效果實戰(zhàn)講解 圓角(Ro...
    世上無南西閱讀 1,777評論 0 11

友情鏈接更多精彩內(nèi)容