timeAxis

功能描述

时间轴UI，可用于物流显示,用例见 index.html。

效果图

timeAxis - 图1

依赖的模块

./libs/index.css

快速使用

  1.  <div class="list">
  3.     <div class="item-inner flex-box-x active">
  4.         <div class="item-date">
  5.             <div class="date">05-26</div>
  6.             <div class="time">04:00</div>
  7.         </div>
  9.         <div class="dot"><i></i></div>
  10.         <div class="item-main col-xs-x">
  11.             <div class="item-type">已签收</div>
  12.             <div class="item-content">[代收点] 您的快递已签收，期待再次为您服务。</div>
  13.         </div>
  14.     </div>
  16.     <div class="item-inner flex-box-x">
  17.         <div class="item-date">
  18.             <div class="date">05-25</div>
  19.             <div class="time">15:42</div>
  20.         </div>
  22.         <div class="dot"><i></i></div>
  23.         <div class="item-main col-xs-x">
  24.             <div class="item-type">待取件</div>
  25.             <div class="item-content">[代收点] 您的快递已经暂存至厦门代收点，请及时查收。</div>
  26.         </div>
  27.     </div>
  28.     ......
  29. </div>

特别说明

样式修改，见用例 index.html。