From db855ceca1c4cbd7751a452e525ffc0abd9cd60a Mon Sep 17 00:00:00 2001 From: guandai Date: Sun, 14 Jun 2015 11:31:53 +0200 Subject: [PATCH] update readme --- .gitignore | 2 +- README.md | 60 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 61 insertions(+), 1 deletion(-) mode change 100644 => 100755 README.md diff --git a/.gitignore b/.gitignore index a06af5d..f0d2757 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,4 @@ .DS_Store node_modules /dist -.idea \ No newline at end of file +.idea diff --git a/README.md b/README.md old mode 100644 new mode 100755 index 919a444..6fc9a07 --- a/README.md +++ b/README.md @@ -199,6 +199,66 @@ $('#container').perfectScrollbar('update'); // Update $('#container').perfectScrollbar('destroy'); // Destroy ``` +## RequireJS usage + +For RequireJS loader, no need to write shim, simply import two libs: + +```javascript +require.config({ + paths: { + perfectScrollbarJQuery: '.../perfect-scrollbar.jquery', + perfectScrollbar: '.../perfect-scrollbar', + } + ... +}) +``` + + +and load `perfectScrollbar` in the initialiser of your app: + +```javascript +# for vanilla JS: +window.Ps = require('perfectScrollbar'); + +# for jQuery: +require('perfectScrollbarJQuery'); +``` + + +## AngularJS + RequireJS usage + +With the require.config settings above, at the beginning of your app module +definition, you can have following code: + +```javascript +define([ + 'angular', + 'perfectScrollbar', + 'perfectScrollbarJquery' +], +function (angular) { + var myApp = angular.module('myApp', []) + .run(function() { + window.Ps = require('perfectScrollbar'); + require('perfectScrollbarJQuery'); + }) + return myApp; +}); +``` + +And initialise perfectScrollbar in a controller: + +```javascript +# by vanilla JS: +var container = document.getElementById('imgLoader'); +Ps.initialize(container); +Ps.update(container); + +# or by jQuery: +var imgLoader = $("#imgLoader") +imgLoader.perfectScrollbar(); +``` + ## Optional parameters perfect-scrollbar supports optional parameters.