ionic侧拉实现

来源：互联网发布：淘宝网返利网编辑：程序博客网时间：2024/05/22 03:30

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>

<script type="text/javascript" src="js/ionic.bundle.min.js" ></script>
<link rel="stylesheet" href="css/ionic.css" />
</head>
<body ng-app="myapp" ng-controller="ContentController">
<ion-side-menus>

<ion-side-menu-content>


<ion-header-bar class="bar-positive">
<h1 class="title">八维商城</h1>
</ion-header-bar>

</ion-side-menu-content>


<ion-side-menu side="left">

<ul class="list">
<li class="item">你好啊</li>
<li class="item">我来拉</li>

</ul>

</ion-side-menu>


<ion-side-menu side="right">
<h3>别跑啊</h3>

</ion-side-menu>

</ion-side-menus>

</body>
<script>

var app=angular.module("myapp",["ionic"]);

app.controller("ContentController",function($scope, $ionicSideMenuDelegate){

$scope.toggleLeft = function() {

$ionicSideMenuDelegate.toggleLeft();
};

})

</script>
</html>

阅读全文

0 0