Javascript
【javascript】jQueryを使用しないプリローダーMaterial Design Preloader
September 27, 2016
Material Design PreloaderはjQueryを使用しない、マテリアルデザインを基にしたプリローダー。
headに含める
<link href="css/materialPreloader.min.css" rel="stylesheet prefetch"> <script type="text/javascript" src="js/angular-Material-Preloader.min.js"></script>
angularMaterialPreloader追加
var myApp = angular.module("app", ["angularMaterialPreloader"])
div material-preloaderを含める
<div material-preloader position="top" height="5px" col1='#159756' col2='#da4733' col3='#3b78e7' col4='#fdba2c' ></div> // material-preloader as attribute
もしくはmaterial-preloaderを含める
<material-preloader position="top" height="5px" col1='#159756' col2='#da4733' col3='#3b78e7' col4='#fdba2c' ></material-preloader> // material-preloader as element
VARIABLE
$scope.materialPreloader = TRUE/FALSE; // Use true or false to on/off the materialpreloader.
materialPreloader Options
| attribute | Default |
|---|---|
| position | top |
| height | 5px |
| col1 | #159756 |
| col2 | #da4733 |
| col3 | #3b78e7 |
| col4 | #fdba2c |
MITライセンス
