タブを切り替えると同時に画面の表示位置も一番上に戻したい

前提・実現したいこと

Wordpressがベースの環境で、タグを直接記入してWEBページを作成しています。
人物の紹介ページで「プロフィール」「コラム」「問い合わせ」といったタブを準備し、
各タブの中に必要な情報を登録しました。
プロフィールの中にもコラムをいくつか表示しており、「全てのコラムはこちら」というボタンを
用意してクリックしたらコラムのタブに切り替わるようにしました。
タブは正しく切り替わるのですが、画面のスクロール位置が変わらないため
タブ切り替え後の画面がコラムの中途半端な場所になります。
タブ切り替え後、画面を一番上に戻したいのですが方法はありますでしょうか。

どうぞ宜しくお願いします。

発生している問題・エラーメッセージ

<a href="#top"><label for="TAB2">全てのコラムはこちら</label></a>
↑TAB2に切り替わるが、#topの位置までスクロールしない

<label for="TAB2"><a href="#top">全てのコラムはこちら</a></label>
↑#topまでスクロールするが、TAB2に切り替わらない

Lhankor_Mhy

2021/07/28 08:04

どちらであってもHTMLの文法違反です。 JavaScriptで対応するのが無難なように思います。

行動規範の内容に同意します

回答1件

ベストアンサー

labelでやるのはラジオボタンのチェックですか？
htmlだけでは無理なのでたとえばこんな感じ

HTML
1<input type="radio" name="tab" id="TAB1" onchange="location.hash='top'">
2<input type="radio" name="tab" id="TAB2" onchange="location.hash='top'">
3<input type="radio" name="tab" id="TAB3" onchange="location.hash='top'">
4<label for="TAB1">tab1</label>
5<label for="TAB2">tab2</label>
6<label for="TAB3">tab3</label>