100% height div in angularjs (ng-scope class issue)

Vote count:

0

I want to put a 100% height image in my front page, and then show other images and text when scrolling. I followed this guide to do so:

Explanation: http://ift.tt/1kuXX4i

Demo: http://ift.tt/1rQOibW

The issue is, that as far as I am concerned, if you want to have a 100% height div, you need to give 100% height to all the parent elements. Therefore, in order to make this work in angularjs I have given 100% height to html, body and ng-scope (using min-height:100% does not work).

The issue is that having height:100% in the ng-scope class leads to some unwanted behavior. For example, if I want to add a footer (which is static, outside the ng-view directive), the footer is displayed right after the first 100% height, instead of appearing at the end of the page, something like what I simulated here:

http://ift.tt/1w06MDn

by doing:

#ng-scope {
    height: 100%;
    background-color:red;
}

So, is there any way of having 100% height divs in angularjs without modifying the height of ng-scope?

Thanks a lot!

asked 56 secs ago

user1294122

33

100% height div in angularjs (ng-scope class issue)