模糊基於角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; 
}