ログイン
問題22

「scrollしたら」を設定しよう

アイコン画像

問題22:「scrollしたら」を設定しよう

画面をscrollしたらscroll位置を、
.scroll-valに表示使用しよう

エディターのアイコンあらかじめエディタに書くコード

                <div class="scroll-val">0</div>
¥HTML¥
              
                body{
 height:5000px;
}
.scroll-val{
 position: fixed;
}
¥CSS¥
              

ブラウザのアイコン期待する画面

タグアイコン解答ソースコード

              $(function(){
 $(window).on('scroll', function(){
  $('.scroll-val').text($(this).scrollTop());
 });
});
¥JavaScript¥
            

コメントのアイコン解説

画面のscroll位置を取得するには、
scrollTop() を使います。
$(this) は $(window) のことなので、
$(this).scrollTop() となります。
ログインして解答を見る
1.JavaScriptでできること
続きの動画を見たい方は公式LINEから「JavaScript」と送信すると動画が見れます。
JavaScriptを学ぶなら現役エンジニア監修「甲賀コース」
キャンペーン

閉じる