如何让屏幕透明？答案

【问题标题】：How to make the screen transparent?如何让屏幕透明？
【发布时间】：2017-03-15 22:40:18
【问题描述】：

我正在尝试在单击 show() 时向我的应用程序添加一个微调器，当前页面应该转到透明视图，并且只有我的微调器应该突出显示

<button (click)="show()">show</button>
<button (click)="hide()">hide</button>
<div class="container" *ngIf="isBusy">
    <div class="backdrop"></div>
    <ion-spinner name="bubbles" color="primary"></ion-spinner>
</div>

目前我可以显示和隐藏微调器，我需要的是当显示微调器时，我的视图中的所有内容都应该移动到透明模式，并且应该只显示微调器而不是其他内容

【问题讨论】：

你是说背景 div？

标签： angular typescript ionic2

【解决方案1】：

假设您的内容包含在某个包装 div 中。然后在 Busy 状态下，您需要向该 div 添加一些关闭指针事件并设置较低不透明度的类

<div [class.nonclickable]="isBusy">
    <!-- content -->
</div>
<div class="container" *ngIf="isBusy">
    <div class="backdrop"></div>
    <ion-spinner name="bubbles" color="primary"></ion-spinner>
</div>

和样式：

.nonclickable {
    opacity: .3;
    pointer-events: none;
    cursor: not-allowed;
}

【讨论】：

【解决方案2】：

你可以这样做

<div *ngIf="!isBusy">
    //content
</div>
<div class="container" *ngIf="isBusy">
    <div class="backdrop"></div>
    <ion-spinner name="bubbles" color="primary"></ion-spinner>
</div>

【讨论】：

如果我喜欢这个内容会被隐藏我希望比赛出现，它应该处于禁用状态
“处于禁用状态”是什么意思？