1

我正在使用一个名为 jQuery Validation Engine 的插件,但我很难找到任何支持我的问题。

当字段留空时,引擎基本上会在我的表单上创建一个工具提示。我一切正常,我只是想正确定位它。

JS fiddle显示表单代码和内联脚本,完整的 JS 文件和 CSS 链接在 JSFiddle

该插件可以在这里找到。可以在此处(通过我正在使用它的网站) 找到 jQuery,也可以在此处找到 jQuery 。CSS 文件可以在这里找到。

文档指出您可以使用一些预设值(右上角、右下角、左上角等)进行定位。我正在使用右上角。

基本上我需要弄清楚如何稍微移动定位。定位工作正常,但由于我的图形更改为使箭头位于中心,它看起来不正确。

我正在努力找出 topRight 属性是如何设置的,以及如何将它微调几个像素以使其到达我需要的位置。

任何有更好眼睛的人都可以看看他们是否可以为我指明正确的方向吗?

4

1 回答 1

0

看起来工具提示 div 由 css 中的此类控制:

(位于:http ://www.position-relative.net/creation/formValidator/css/validationEngine.jquery.css 或您当地的同等机构。)

.formError .formErrorContent {
    width: 100%;
    background: #ee0101;
    position:relative;
    color: #fff;
    width: 150px;
    font-size: 11px;
    border: 2px solid #ddd;
    box-shadow: 0 0 6px #000;
    -moz-box-shadow: 0 0 6px #000;
    -webkit-box-shadow: 0 0 6px #000;
    padding: 4px 10px 4px 10px;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
}

用你自己的覆盖这个 css 类中的值应该可以让你用工具提示做几乎任何你想做的事情:颜色、定位等。例如:解决定位问题可以通过在覆盖中添加边距来完成(如果不适合您的需要,可以更改过度选择器):

 fieldset .formError .formErrorContent {
    margin-bottom: 10px;
}

这会将整个工具提示向上移动 10 个像素。

我希望这对您的问题有帮助!

于 2012-09-07T21:26:36.600 回答