我正在使用 ionic 和 angular.js，想知道如何将背景样式正确应用到侧边菜单。我确实有一个模糊的背景图像和悬停在背景图像上方的内容框。我的意图是打开左侧或右侧菜单时，背景保持固定，只有内容移动。
左边的屏幕截图显示了我目前的结果。背景图像附加到菜单的每个内容 View ，否则将其设置为透明会显示底层内容。 右边的屏幕截图是一个简单的 html 模型，用于说明最终结果。
有人有什么建议吗？
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<link href="css/style.css" rel="stylesheet">
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/services.js"></script>
</head>
<body ng-app="starter" animation="slide-left-right-ios7">
<ion-header-bar align-title="left" class="bar-positive">
<div class="buttons">
<button class="button" ng-click="doSomething()">Left Button</button>
</div>
<h1 class="title">Title!</h1>
<div class="buttons">
<button class="button">Right Button</button>
</div>
</ion-header-bar>
<ion-side-menus class="sideMenus">
<ion-side-menu-content class="custom">
<h1>bdafs1</h1>
</ion-side-menu-content>
<ion-side-menu side="left" class="custom">
<h1>bdafs2</h1>
</ion-side-menu>
</ion-side-menus>
</body>
</html>
最佳答案
基本上，您需要将背景设置为正文，然后将其他所有内容设为透明。
body {
background: url(http://i.imgur.com/hgzVvzN.jpg);
background-attachment:fixed;
background-position: center;
}
.pane, .menu, .view, .list, .item {
background: transparent;
}
关于javascript - 将背景应用到 ionic 侧菜单，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24839998/