IONIC----02.ionicBackdrop

来源:互联网 发布:如何用微博推广淘宝 编辑:程序博客网 时间:2024/05/29 16:32
<!doctype html><html><head><meta charset="utf-8"><meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no,width=device-width,height=device-height"><script src="./lib/js/ionic.bundle.min.js"></script><link rel="stylesheet" type="text/css" href="./lib/css/ionic.min.css"><title>Ionic</title></head><body ng-app="myApp" ng-controller="fristController">    <ion-header-bar class="bar-positive">        <h1 class="title">$ionicBackdrop</h1>    </ion-header-bar>    <ion-content>        <div class="ezpop has-header padding">            <a class="button button-block button-calm" ng-click="retain();">retain</a>            <a class="button button-block button-calm" ng-click="release();">release</a>        </div>    </ion-content>    <ion-footer-bar class="bar-positive">        <h1 class="title">背景幕锁:{{locks}}</h1>    </ion-footer-bar></body></html><script>angular.module("myApp",["ionic"]).controller("fristController", function($scope, $ionicBackdrop, $timeout,$interval) {    $scope.locks = 0;    //保持背景幕    $scope.retain = function() {        $ionicBackdrop.retain();        $scope.locks++;    };    //释放背景幕    $scope.release = function() {        $ionicBackdrop.release();        $scope.locks > 0 ? $scope.locks-- : 0;    };    $interval(function(){        if($scope.locks > 0){            $ionicBackdrop.release();             $scope.locks--;        }    },2000)});</script>

GITHUB

0 0
原创粉丝点击