1

と を使用して、非常に単純なタスクを実行しようとしていCoffeeScript RailsますHaml。あまり使っCoffeeScriptていませんが、試してみたいと思います。

ユーザーがボタンを押すと、ビューを特定の div id にスクロールします。私のページの上部には、次のようなIDがあります。

#area_1

私のリンクは次のようになります。

= link_to "Area", "#", id: "area_button_1"

自動生成されCoffeScriptたファイルには、次のような関数があります。

$ ->
  scrollToArea = (button, area) ->
    $(button).click ->
      scrollTo(area, 800)

次のように、ビューファイルの1つでこのメソッドを呼び出そうとします:

:javascript
  scrollToArea("#area_button_1", "#area_1") 

しかし、これは機能していません。私が間違っていることについてのアイデアはありますか?

4

2 に答える 2

1

私は coffeeScript には詳しくありませんが、これを実現するための jQuery を次に示します。うまくいけば、簡単に変換できるはずです。

これが行うことは、ウィンドウの をターゲット要素scrollTopの最上部の位置に等しくすることです。offset()

<a href="#button" class="scroll-trigger">Go to button</a>
$('.scroll-trigger').click(function() {
    $(window).scrollTop($(this).attr('href')).offset().top);
});

フィドルの例


スクロールをアニメーション化する場合は、これを使用します。

$('.scroll-trigger').click(function() {
    var $el = $(this);
    $('html, body').animate({
        scrollTop: $($el.attr('href')).offset().top
    }, 2000);
});

フィドルの例

于 2013-08-17T12:55:04.537 に答える