![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?e8efa67)
No.2ベストアンサー
- 回答日時:
こんにちは
簡単な方法の例です。
behavior:"smooth"に対応していないブラウザもまだあるようですが…
https://caniuse.com/#search=behavior
<!DOCTYPE HTML>
<html lang="ja">
<head><title>Sample</title>
<script type="text/javascript">
function back(){
document.querySelector("body").scrollIntoView({behavior:"smooth", block:"start"});
}
</script>
</head>
<body>
<p>Top</p>
<div style="height:2000px;">SPACE</div>
<p><img src="back.jpg" onclick="back();" /></p>
</body>
</html>
※ 対応していないブラウザでも同様の動作をさせたい場合は、自前でscrollY(あるいはscrollTop)等を制御するアニメーションを行えば可能です。
https://developer.mozilla.org/ja/docs/Web/API/Wi …
https://developer.mozilla.org/ja/docs/Web/API/El …
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 空白で入力フォームのボタンをクリックしたら、ブラウザの上部からjavascriptで 表示されるアラ 1 2022/05/20 11:16
- その他(ブラウザ) Microsoft edgeのスクロールバーについて 2 2022/09/19 16:56
- Windows 10 ウィンドウズ10のブートトラブル 2 2022/12/29 19:13
- ノートパソコン PCのshift+右クリックについて 2 2022/08/22 08:52
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
- PowerPoint(パワーポイント) パワーポイント アニメーション効果で、テキストと同時に画像を表示させる方法を教えてください 2 2022/09/12 21:06
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- JavaScript HTML&CSS Javascriptによる動的テーブル 1 2023/03/27 19:51
- HTML・CSS トリミングで表示した画像をクリックで元どおりにしたい 3 2022/12/16 18:49
- iPhone(アイフォーン) iphoneでネット画像を保存できなくなった 3 2022/06/05 15:58
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
onLoadをbodyタグ以外で使用する
-
指定の年月日時にcssを自動で切...
-
javascriptでalertの文字列をコ...
-
【javascript クロスブラウザ...
-
javascriptにてonclickを無効
-
htmlソースの取得方法
-
変数の代入値を外部の.txtファ...
-
特定のページから移動してきた...
-
<a href="#" …>の意味を教えて...
-
<div>のタッチ状態を維持したま...
-
別ファイルのfunctionの読み込み方
-
getElementsByNameで要素が取得...
-
プラグイン無しでContactform7...
-
SQLのWHEREで全てを質問する方法
-
ウインドウを縮小しても文字を...
-
プルダウンメニューを別ファイ...
-
Dreamweaver で 外部JSを読み込...
-
「関数が定義されていない」と...
-
window.openで同画面遷移しない
-
確認ダイアログで「キャンセル...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
javascriptでalertの文字列をコ...
-
変数の代入値を外部の.txtファ...
-
onLoadをbodyタグ以外で使用する
-
【javascript クロスブラウザ...
-
「jQuery」アニメーションをル...
-
特定のページから移動してきた...
-
ブラウザーのバージョンによる...
-
画像ファイルのアドレスに今日...
-
指定の年月日時にcssを自動で切...
-
javascriptでページ内の一部分...
-
このDOCTYPEは、何なんでしょう...
-
1 ~ Nまでの整数の総和(1+2+3....
-
<head>と<body>どっちに入れる...
-
トップページindex.htmlにカレ...
-
日替わりメッセージの表示
-
type="text/javascript"
-
セキュリティ保護の警告が出な...
-
javascriptにてonclickを無効
-
ブラウザをJavaScriptで最小化…
-
htmlソースの取得方法
おすすめ情報