CODEWITHSUNDEEP
javascriptjquerycssangularjs
Taylorsuk
Taylorsuk

Reputation: 1449

Adding full page background to a single view in Angular JS

I need to add a fullscreen CSS background to a single view in my app. I tried to achieve this by adding a class to the body however this remains in the cache and remains on the body when switching view.

I'm having this issue because my <div ng-view=""></div> is within the <body> so I cannot easily add a fullscreen BG from within the view.

Upvotes: 0

Views: 1595

Answers (1)

Taylorsuk
Taylorsuk

Reputation: 1449

For a very quick simple answer this is what I did.

applied conditional class to ng-view

index.html

ng-class="{'homebg' : home}"

style.scss

.homebg { height: 100%; background-image: url('../images/home-bg.jpg'); background-size: cover; background-position: center center; }

Controller.js

$scope.home = true;

Upvotes: 1

Related Questions