From 8828c1117b6996b2a0afbbc7d6eaa2374ca8ea74 Mon Sep 17 00:00:00 2001 From: thednp Date: Tue, 14 Feb 2017 18:34:41 +0200 Subject: [PATCH] V4 Documentation Updates --- README.md | 34 ++++++++++++++++++++++++++++------ index.html | 10 +++++----- v4.html | 33 +++++++++++++++++++++++++++++++-- 3 files changed, 64 insertions(+), 13 deletions(-) diff --git a/README.md b/README.md index df4cdb6e..125aefc7 100644 --- a/README.md +++ b/README.md @@ -19,18 +19,30 @@ $ bower install --save bootstrap.native `bootstrap.native` is UMD (Universal Module Definition) compatible. It will work correctly in CommonJS and AMD environments, but falls back to exporting to `window` in a normal ` - + + - + ``` +**Use the Bootstrap 4 version:** + +```html + + + + + + + +``` + **Warning:** Do not use files directly from `/lib` folder! These files are just sources for the builds located in the `/dist` folder. You can also use `bootstrap.native` in a CommonJS environment: @@ -41,7 +53,7 @@ var bsn = require("bootstrap.native"); var btn = new bsn.Button(element,'loading'); ``` -**Note:** If you are working in a virtual browser environment (i.e. running front-end tests in NodeJS), bootstrap-native requires both `window` and `document` to be in scope. You will need to use a mock browser. +**Note:** If you are working in a virtual browser environment (i.e. running front-end tests in NodeJS), `bootstrap.native` requires both `window` and `document` to be in scope. You will need to use a mock browser. ## Note About the Factory Methods @@ -50,7 +62,17 @@ As mentioned above, the object properties of the exported object, when using `re So when using `bootstrap.native` inside of a NodeJS app, make sure you create a proper Browser-like environment first to avoid unexpected behaviour. # Browser Support -The components are developed with clean code mainly for modern browsers that nativelly support HTML5. When using polyfills, IE8-IE9 will thank you. +The components are developed with clean code mainly for modern browsers that nativelly support HTML5. When using polyfills, IE8-IE10 will thank you. The library comes with a custom polyfill you can use right away. + +```html + + + + + + + +``` # Custom Builds You can make a custom build of bootstrap-native, including only the modules you need, by using the `build.js` and `build-v4.js` scripts. diff --git a/index.html b/index.html index 159dd2dd..d1351db3 100644 --- a/index.html +++ b/index.html @@ -40,7 +40,7 @@ - + @@ -3244,7 +3244,7 @@

Navigation

- + diff --git a/v4.html b/v4.html index f1e23209..1d1c6f15 100644 --- a/v4.html +++ b/v4.html @@ -117,6 +117,35 @@

What's the fuzz?

+ +

Using V4

+

The Native JavaScript for Bootstrap version 4 is identical with the version 3 in terms of usage, options, methods and original events, except that version 4 does not support the Affix component, so please refer to V3 for documentation.

+ +

Quick Usage Guide

+ +

CDN

+ +
<script type="text/javascript" src="//cdn.jsdelivr.net/bootstrap.native/2.0.4/bootstrap-native-v4.min.js"></script>
+
+ +
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/bootstrap.native/2.0.4/bootstrap-native-v4.min.js"></script>
+
+ +

Unfortunately IE10+ browsers still require Event, CustomEvent and dispatchEvent polyfills:

+ +
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/bootstrap.native/2.0.4/polyfill.min.js"></script>
+
+ +

npm/Bower

+
$ npm install --save bootstrap.native
+# Or
+$ bower install --save bootstrap.native
+
+ +

In order to be able to use V4, after you have installed the package you need to edit the bower.json and/or package.json to use the V4 as main file:

+
"main": "dist/bootstrap-native-v4.js",
+ +

Examples

Alert