3

ページの上部に、クリックするとDIVにスクロールするボタンがありますが、Facebookのように、h3を1つの色にフラッシュし、スクロールすると元の色に戻すこともできます。通知。

これまでのJQuery:

        function goToByScroll(id) {
        $('html,body').animate({ scrollTop: $("#" + id).offset().top }, 'slow');
        $("#" + id).css({ "color": "yellow" }).delay(1000).css({ "color": "#222" });
    }

これまでのHTML:

<a href="javascript:void(0)" onclick="goToByScroll('createdest')">Add Destination</a>

<h3 id="createdest">Add a Country</h3>

しかし、これまでのところ何も変わっていません。次に何を試すことができますか?

4

2 に答える 2

3

関数のコールバックを使用してanimate()、アニメーションが完了した直後にコードを実行します。

dataまた、要素の元の色を保存するための属性を追加しました。

var $target = $("#" + id);
$target.data('oldColor', $target.css("color"));
$target.css("color", "yellow");

$('html,body').animate({ scrollTop: $("#" + id).offset().top }, 'slow', function() {
  $target.delay(1000).css('color', $target.data('oldColor'))
});
于 2012-06-20T00:03:48.057 に答える
2

queue()メソッドを試してください:

   function goToByScroll(id) {
            $('html,body').animate({ scrollTop: $("#" + id).offset().top }, 'slow');
            $("#" + id).css({ "color": "yellow" }).delay(1000).queue(function() {
              $(this).css({ "color": "#222" });
   })
于 2012-06-20T00:19:21.100 に答える