title: how to start hiding from 100px from top after used affix bootstrap
body: <p>I want to start  hiding content 100px from top. I have applied Bootstrap Affix with Nav in same div. but when i am scrolling up affix work fine but i want to hide div after affix div not from browser top.
  Here is my code</p>
  
  <pre><code>&lt;div class="col-lg-9"&gt;                
  &lt;div class="header-affix" data-spy="affix" data-offset-top="50" data-offset-bottom="380" style="z-index: 1" id="header"&gt;
      &lt;div&gt;Content&lt;/div&gt;
      &lt;div&gt;Content&lt;/div&gt;
      &lt;ul class="nav nav-inline act-details" id="menu" role="navigation"&gt;
          &lt;li class="nav-item active"&gt;
              &lt;a class="nav-link" href="#desc"&gt;Description&lt;/a&gt;
          &lt;/li&gt;
          &lt;li class="nav-item"&gt;
              &lt;a class="nav-link" href="#img"&gt;Images&lt;/a&gt;
          &lt;/li&gt;
          &lt;li class="nav-item"&gt;
              &lt;a class="nav-link" href="#maps"&gt;Map&lt;/a&gt;
          &lt;/li&gt;
          &lt;li class="nav-item"&gt;
              &lt;a class="nav-link" href="#details"&gt;Details&lt;/a&gt;
          &lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  &lt;div class="act-detail"&gt;
      &lt;div class="description" id="desc"&gt;&lt;/div&gt;
      &lt;div class="images" id="img"&gt;&lt;/div&gt;
      &lt;div class="maps" id="maps"&gt;&lt;/div&gt;
      &lt;div class="details" id="details"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p><img src="https://i.stack.imgur.com/PnMpp.png" alt="enter image description here"></p>