title: angularjs fullscreen homepage only
body: <p>I am working on a website that has a fullscreen background only on the homepage. On other pages, they use normal bootstrap container. I used an additional view in order to pass the 100% height to its inner css. But this way, all other pages are forced to moved down, because the space above them are the 100% height. My question is how I do remove the 'style = height:100%' if I am not at homepage?</p>
  
  <pre><code>&lt;body&gt;
      &lt;div ui-view="enterHome" style="height:100%;"&gt;&lt;/div&gt; &lt;!-- additional view --&gt;
  
      &lt;div ui-view="navbar"&gt;&lt;/div&gt;
      &lt;div ui-view="body"&gt;&lt;/div&gt;
      &lt;div ui-view="footer"&gt;&lt;/div&gt;    
  &lt;/body&gt;
  </code></pre>
  
  <p>my app.js is like below: (ie, for state = enterHome, I only have the enterHome template displayed.)</p>
  
  <pre><code>.config(function($stateProvider, $urlRouterProvider){
  $urlRouterProvider.otherwise("/");
  $stateProvider
      .state('enterHome',{
          url:"/",            
          views:{
              "navbar":{
              },
              "carousel":{
              },
              "enterHome":{
                  templateUrl:"templates/enterHome.body.html",
                  controller: "EnterHomeBodyController"
              },
              "footer":{                  
              }               
          }
      })
  </code></pre>