微信小程序中的 hover-class


微信小程序中,可以用 hover-class 屬性來指定元素的點擊態效果。但是在在使用中要注意,大部分組件是不支持該屬性的。

目前支持 hover-class 屬性的組件有三個:view、button、navigator。

不支持 hover-class 屬性的組件,同時也不支持 hover-stop-propagation、hover-start-time、hover-stay-time 這三個屬性。

使用方法:

  <view hover-class="bg_red">這是一段文字</view>

  .light_blue{

    background: bg_red; // 這里可以寫任何你想要的樣式  

  }

  當 hover-class 的值為 none 時,組件上不會有任何點擊態效果。

注意事項1:

  當組件中沒有任何指定的類時,直接使用 hover-class 就會起到相應的作用,但是當組件中已經指定了其他可能與 hover-class 沖突的類時,hover-class 無效。

解決辦法:

  將 hover-class 指定的類放在對應 wss 文件的最末尾,這樣就不會被其他類所覆蓋。

注意事項2:

  通常,當一個 view 組件中包含 image 等不支持 hover-class 的組件,但又需要在該組件上使用 hover-stop-propagation 屬性的作用時,需要將不支持 hover-class 的組件用view、button 或 navigator 包裹起來。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM