README

与 Twitter Bootstrap 一起使用的 JavaScript 工具。

要求

• Twitter Bootstrap 3.0+

安装

确保在页面底部包含 bsutils-core.min.js，然后初始化一个新的 BsUtils 实例

    <!-- ... -->

    <script src="bsutils-core.min.js"></script>

    <script>
        (function() {

            var bsutils = new BsUtils();
            // ...

        }) ();
    </script>

  </body>
</html>

模块

默认情况下，bsutils 并不做什么。精华来自于模块。您需要手动将所需模块包含到您的页面中才能使用它们。

<script src="bsutils-core.min.js"></script>
<script src="bsutils-module-mymodule.min.js"></script>

<script>
    (function() {

        var bsutils = new BsUtils({
            mymodule_options = {}
        });

        var mymodule = bsutils.module("mymodule"); // Will be initialized with mymodule_options

        // ...

    }) ();
</script>

version 检测 Bootstrap CSS 版本

此功能目前由 Bootstrap 提供，因此您需要编译自己的 Bootstrap LESS/SASS 文件才能使用它。

LESS 安装

在 variables.less 中添加

@version: "3.3.1"; // Replace with the version that you are using

在 utilities.less 中添加

.bootstrap-version {
  &:extend(.hidden);
  &:after {
    content: $version
  }
}

SCSS 安装

在 _variables.scss 中添加

$version: "3.3.1"; // Replace with the version that you are using

在 _utilities.scss 中添加

.bootstrap-version {
  @extend .hidden;
  &:after {
    content: $version
  }
}

选项

方法

示例

var bsutils = new BsUtils();

// Get the Bootstrap version (e.g. "3.3.1")
console.log(bsutils.module("version").get());

viewport 检测活动视口

选项

方法

示例

var bsutils = new BsUtils();

// Get the current viewport (e.g. "xs", "md", etc.)
console.log(bsutils.module("viewport").get());

// Test the current viewport
console.log(bsutils.module("viewport").is("xs")); // TRUE only if current viewport is "xs"
console.log(bsutils.module("viewport").lt("md")); // TRUE only if current viewport is "xs" or "sm"
console.log(bsutils.module("viewport").lte("md")); // TRUE only if current viewport is "xs" or "sm" or "md"
console.log(bsutils.module("viewport").gt("md")); // TRUE only if current viewport is "lg"
console.log(bsutils.module("viewport").gte("md")); // TRUE only if current viewport is "lg" or "md"