jQuery工具验证器错误消息位置

我目前使用jQuery工具验证，但错误消息的位置是绝对的。因此，如果我的表单足够大，并且需要向下滚动，则错误消息也会滚动。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>

请帮助。

来源

2013-07-16 celticharp

问题解决了！

我删除了这一点：

html, body 
{ 
    height: 100%; 
}

从我的CSS。不知道它为什么这样工作。

来源

2013-07-17 10:14:56 celticharp

尝试位置：固定;这将使它保持原位。您可能需要调整左侧和底部。

来源

2013-07-16 11:27:59 Tdelang

谢谢你的回答。我已经尝试过没有成功。我把它放在form-validation-error css规则中，但它被样式规则覆盖（由javascript创建）。有没有一种方法可以将其作为验证器方法的conf？ – celticharp

jQuery工具验证器错误消息位置

回答

相关问题