模糊基于角js的一些条件的背景图像

Question

我有一个登录页面，如果我点击密码按钮下的忘记密码，滑块面板将打开并显示恢复密码的信息。一旦这个滑块面板打开，我需要模糊背景图像。

<div class="signinBackground" ng-click="signIn.closeForgotSlider($event)"> 
    <div class="col text-right col-top forgotEmailPassDiv"> 
     <a ng-click="signIn.forgotPassword($event)">{{'FORGOTPASSWORD'| translate}}</a> 
    </div> 
</div> 

如何在角实现这一目标？

Answer 1

假设你有以下的背景图像元素：

<div ng-class={'blurBg': showBlurBg}><img src=".."/></div> 

您需要更改如下：

$scope.showBlurBg = true;//If you want to blug background 
$scope.showBlurBg = false;//If you dont want to blug background 

添加CSS模糊背景：

.blurBg { 
    opacity: 0.5; 
}