「無効なパスワード」などのユーザーエラー警告を表示するために Web ページで alertify.js を使用しています。開いたキーボードのすぐ上でも問題ありません。CSSで何をすべきか知っている人はいますか?
これは私が今使っているものです。ただし、これにより、ページの上部から 10px に配置されます。下にスクロールした場合、ユーザーはそれを見ることができません。そして、それらを一番下に置いたままにしておくと、キーボードが開いていれば、その後ろに隠れます。
.alertify-logs {
top: 10px;
right: 10px;
}
編集済み: キーボードは実際にはページの上部を上に移動しているため、アドレス バーはアラートを隠しています。CSS に固定位置を追加すると、開いているキーボードがそれを押し上げているように見えます。
私の解決策：
var isMobile = false;
//test for mobile device/browser
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)){
isMobile = true;
}
エラーメッセージを出力する場合：
if(isMobile){
//get top of viewable screen y-coordinate
var scrollY = window.pageYOffset;
//output error
alertify.error("Password is incorrect.");
//adjust error placement
$(".alertify-logs").css("top", scrollY+"px");
}
このエラー メッセージの動きは、ページから遷移する前に数秒間画面にとどまるため、機能します。