More than 5 years have passed since last update.

CoffeeScriptでスムーススクロール

Posted at 2015-06-11

目的

iPhoneのように、トップのナビゲーションバーを押したら、ページトップへスムーススクロールするようにしたい。

コード

などjQueryのプラグインはいっぱいあるようだが、これぐらいプラグインを使わなくても、すこし書けばいけそうと思ったら、StackOverflowにあった。
CoffeeScriptで書く必要があったので、書いておく。

<body id="page-top">
	...
	<a href="#page-top">top</a>
</body>

  $("li a[href^='#']").on 'click', (e) ->
    e.preventDefault()
    hash = this.hash
    $('html, body').animate {
      scrollTop: $(hash).offset().top
    }, 300, ->
      window.location.hash = hash
    false

よかったよかった。

参考サイト

javascript - How to add smooth scrolling to Bootstrap's scroll spy function - Stack Overflow

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up