Javascript(jQuery)でのスムーズスクロールについて質問です。

Question

ピ

39

38もっと見る

100pt

コンピュータウェブ制作

Javascript(jQuery)でのスムーズスクロールについて質問です。

下記のようにAタグを押して、idの位置へのスムーズスクロールは実装できたのですが、
Javascriptから実行してidへのスムーズスクロールが出来ません。
どなたかご教授願います。m(_ _)m

//--- これならできた-------------
＜a id="point1"></a＞
＜a href="#point1">point1に移動</a＞

//--- こんな感じにしたい。---------
function scroll() {
point1への移動処理
}
＜a href="javascript:void(0)" onclick="scroll();"＞

参考ページ
http://coliss.com/wp-content/uploads-2009/page-scroller-306/demo-2.html

回答の条件

1人2回まで

登録：2010/12/15 14:52:11
終了：2010/12/15 21:57:31

※ 有料アンケート・ポイント付き質問機能は2023年2月28日に終了しました。

コメントはまだありません

人力検索はてなウェブ職人の方に質問です。 JavaScript Fr.. 2010-12-16 09:57:11

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

リクエスト送信済

回答リクエストを送信したユーザーはいません

あすか · Accepted Answer · 2010-12-15T16:24:30+09:00

jQueryを利用するという前提ですよね。

下記のような形でいかがでしょうか。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.js"></script>
<script type="text/javascript">
<!--
function hoge(id) {
    oftop = $('#' + id).offset().top;
    $("html,body").animate({scrollTop: oftop}, 'slow');
    return false;
}
-->
</script>
</head>
<body>
<a href="#" id="point0" onclick="hoge('point1')" style="position:absolute; top:   0px;">原点</a>
<a href="#" id="point1" onclick="hoge('point2')" style="position:absolute; top: 500px;">一番</a>
<a href="#" id="point2" onclick="hoge('point3')" style="position:absolute; top:1000px;">二番</a>
<a href="#" id="point3" onclick="hoge('point4')" style="position:absolute; top:1500px;">三番</a>
<a href="#" id="point4" onclick="hoge('point0')" style="position:absolute; top:2000px;">四番</a>
</body>
</html>

Javascript(jQuery)でのスムーズスクロールについて質問です。

ベストアンサー

あすか856972010/12/15 16:24:30

コメント（0件)

この質問への反応（ブックマークコメント）

トラックバック