2017-11-30 13 views
0

を変更せずに、私は私のhtmlで、この要素を持っている:

<button class="btn" 
      type="button" 
      ng-click="$ctrl.scrollTo()"> 
    </button> 
<div id="result"> 
</div> 

私の方法scrollTo()

scrollTo() { 
    this.$location.hash('result') 
} 

これはうまく動作しますが、私にはないソリューションを希望しますURLを変更する(URLに#resultを追加しない)、可能であれば円滑なスクロールを追加する。

解決策に近い解決策がありますか?

答えて

1

$ anchorScrollという名前で、ページ上でanchorまたはidにスクロールすると、常にURLが変更されることがわかります。しかし、この問題の解決策は数​​多くあります。

一例 - あなたはネイティブのscrollIntoViewを使用することができます(互換性をチェックし、それは、すべてのまともなブラウザで動作してもIE8):

https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView

だからあなたはスムーズスクロール効果を得るために、このような何かをするだろう。

// play around with options if you want - you can put block: "start" which doesn't play very nice with jsfiddle but should work fine on any machine. 
    $window.document.getElementById(id).scrollIntoView({behavior: "smooth", block: "end"}); 

私はあなたのために簡単な例を用意しました:

https://jsfiddle.net/pegla/eoa8v03y/4/

関連する問題