title: Scrolling on page and on modal
body: <p>I'm using following scroll function to scroll to an anchor within my page</p>
  
  <pre><code>$(function() {
    $('.hashscroll-main').click(function() {
      if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') &amp;&amp; location.hostname == this.hostname) {
        var target = $(this.hash);
        target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
        if (target.length) {
          $('html, body').animate({
            scrollTop: target.offset().top -120
          }, 1000);
          return false;
       }
      }
    });
  });
  </code></pre>
  
  <p>This is woring fine so far.</p>
  
  <p>Then I'm using a bootstrap modal which is alway open to have a scrolling winodw within the main page. This modal has it's own navigation with anchors. So I want to scroll to the anchor point in the modal window with following code</p>
  
  <pre><code>$(function() {
    $('.hashscroll').click(function() {
      if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') &amp;&amp; location.hostname == this.hostname) {
        var target = $(this.hash);
        target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
        if (target.length) {
          $('.modal-body').animate({
            scrollTop: target.offset().top 
          }, 1000);
           return false;
        }
      }
    });
  });
  </code></pre>
  
  <p>This result that the scrolling in the modal goes to the end of the modal window and not to the desired anchor point.</p>
  
  <p>The start of my modal html looks like this</p>
  
  <pre><code>&lt;div class="modal hide fade" id="open"&gt;
          &lt;div class="nav" style="display:block !important; position:absolute; top:0;"&gt;
              &lt;ul class="ship"&gt;
                  &lt;li&gt;&lt;a href="#taras1" class="nav-active hashscroll"&gt;MS Taras&lt;/a&gt;&lt;/li&gt;
                  &lt;li class="separator"&gt;|&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#boreas" class="hashscroll"&gt;MS Boreas&lt;/a&gt;&lt;/li&gt;
                  &lt;li class="separator"&gt;|&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#stanserhorn" class="hashscroll"&gt;MS Stanserhorn&lt;/a&gt;&lt;/li&gt;
                  &lt;li class="separator"&gt;|&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#pegasus" class="hashscroll"&gt;MS Pegasus&lt;/a&gt;&lt;/li&gt;
                  &lt;li class="separator"&gt;|&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#triton" class="hashscroll"&gt;MS Triton&lt;/a&gt;&lt;/li&gt;
                  &lt;li class="separator"&gt;|&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#galibu" class="hashscroll"&gt;Galibu&lt;/a&gt;&lt;/li&gt;
                  &lt;li class="separator"&gt;|&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#silas1" class="hashscroll"&gt;Silas&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
  
          &lt;div class="modal-body"&gt;
              &lt;div id="taras1"&gt;
          Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.&lt;/div&gt;
  </code></pre>
  
  <p>Any hint what I'm doing wrong?</p>