フォームで項目が多くて、フォーム全体が1画面内に収まらなかった時に、フォームの先頭にエラー文を出して、その文をクリックするとエラーがあった項目までスクロールさせるという機能をつけたい。
どうやってその場所までスクロールさせるか
↓↓↓
var btn = $(".btn");
var target = 移動先の要素
btn.click(function(){
$('html,body').animate({
scrollTop: $target.offset().top}, {
duration: 400,
easing: "swing",
complete: function(){
//アニメーション後になにかしたいならここに書く
}
});
});ウィンドウのスクロールはhtmlとbody要素のsrollTopの数値を変えるといい。
今回の場合は、エラーになっている項目を目立たせたかったので、その項目のタイトルに背景色をつけた。
アニメーション後にハイライトしたり、点滅させたりでもいいかも。
0 件のコメント:
コメントを投稿