最近在寫h5的頁面,發現有一款架構還不錯給大家推薦一下

wui

說一下自己寫項目的體會吧,自我感覺wui還不錯,能夠讓自己很快地把頁面布局好,而且裡面一些js效果也不用自己去手寫jQuery代碼很友善,下面讓我們一起來認識一下wui這個架構吧

1,accordion（折疊面闆也就是二級清單）預設收縮,如果展開隻需要在包含

.W-UI-collapse

類的

li

節點上，增加

.W-UI-active

類即可,比自己在那寫原生友善又快

2,

W-UI-popover

,彈出框,如果在底部直接在w-ui-popover的類中加

.W-UI-popover-bottom

、

.W-UI-popover-action也可以傳入toggle,使用者不用關心怎麼隐藏的隻需要會使用即可

3輪播

其實wui的輪播和bootstrap相似,隻是多了字首w-ui,其他是一樣的

4,w-ui滾動事件

• Android平台4.0以下不支援div滾動
• Android平台4.0以上支援div滾動，但不顯示滾動條
• 彈出層的div滾動在iOS平台存在事件透傳的問題
• W-UI額外提供了區域滾動元件，使用時需要遵循如下DOM結構

  1 <div class="W-UI-scroll-wrapper">
   2     <div class="W-UI-scroll">
   3         <!--這裡放置真實顯示的DOM内容-->
   4     </div>
   5 </div>
   6 區域滾動預設為absolute
   7 
   8 W-UI('.W-UI-scroll-wrapper').scroll({
   9     deceleration: 0.0005 //flick 減速系數，系數越大，滾動速度越慢，滾動距離越小，預設值0.0006
  10 });
  11 
  12 //如果手動滾動需初始化scroll