0

現在、jQuery ツールの検証を使用していますが、エラー メッセージの位置は絶対です。その結果、フォームが十分に大きく、下にスクロールする必要がある場合、エラー メッセージもスクロールします。

私が望むのは、メッセージが入力フィールドの一番上にある位置に留まることです。

これは 100% CSS の問題である可能性がありますが、修正できませんでした。

ここにいくつかのグローバル構成があります：

$.tools.validator.conf.lang = 'el';
$.tools.validator.conf.position = "top left";
$.tools.validator.conf.message = "<div><em/></div>";  // em element is the arrow
$.tools.validator.conf.offset = [-5, 35];
$.tools.validator.conf.errorclass = "invalid";
$.tools.validator.conf.messageClass= 'form-validation-error';

私のCSSは次のとおりです。

.form-validation-error {
    height:15px;
    background-color:#DC1E32;
    font-size:11px;
    border:1px solid #DC1E32;
    padding:4px 10px;
    color: #fff;
    display:none;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius: 5px;

    -moz-box-shadow:0 0 6px #ddd;
    -webkit-box-shadow:0 0 6px #ddd;
}

.form-validation-error p {
    margin:0;
}

.form-validation-error em {
  display:block;
  width:0;
  height:0;
  border:10px solid;
  border-color:#DC1E32 transparent transparent;

  position:absolute; 
  bottom:-17px;
  left:60px;
  }

私はバリデーターを次のように使用します。

<script type="text/javascript">
  $( document ).ready( function()
  {
     $( "form" ).validator();
  } );
</script>

助けてください。

4

2 に答える 2

0

試行位置: 固定; そうすれば定着します。左と下を調整する必要があるかもしれません。

于 2013-07-16T11:27:59.113 に答える
0

問題が解決しました！

私はこれを削除しました：

html, body
{
   height: 100%;
}

私のCSSから。なぜそれがそのように機能したのかはわかりません。

于 2013-07-17T10:14:56.553 に答える