组件

项目中各种通用的 UI 组件的示例

分页

用于各种使用数据列表的场景。

组件来自 Backgrid Paginator,使用方法参见官方文档

示例

页码边框、未选中时的字色以及选中和悬停时的背景色均为 #F1942D;页码大小为 45 * 40。

<!-- HTML -->

<div class="backgrid-paginator">
  <ul>
    <li class="disabled"><a href="#"><</a></li>
    <li class="active"><a href="#">1</a></li>
    <li><a href="#">2</a></li>
    <li><a href="#">3</a></li>
    <li><a href="#">4</a></li>
    <li><a href="#">5</a></li>
    <li><a href="#">></a></li>
  </ul>
</div>

在使用 Backgrid Paginator 时不要生成前往首页和末页的触发器。

// JavaScript

var paginator = new Backgrid.Extension.Paginator({
    controls: {
      rewind: null,     // 不生成首页
      fastForward: null // 不生成末页
    }
  });