I'm having a consistent problem with labels disappearing on keyup using the Validate plug-in. All of the functionality of the validate plug-in is there -- it works great. But elements are jumping around on the page!
When a field is invalid, the "label for" tag turns the label red and bold. So far, so good. When the info becomes valid as it's entered, the whole label disappears. I think style="display:none;" is being applied to the label. In my case, the css I use causes the form field to jump to the left, taking the place of the label. Subsequent key-up strokes (if they are used/needed) cause the label element to re-appear and the form field to jump back into place. I'm using the most current versions of jQuery and the Validate plug- in. I'm using XHTML Strict. This behavior occurs on all platforms and browsers I've tested. Thanks in advance for any help... Here's my code: <script type="text/javascript"> $(document).ready(function(){ $("#register").validate({ highlight: function(element, errorClass) { $(element).addClass(errorClass); $(element.form).find("label[for=" + element.id +"]").addClass(errorClass); }, unhighlight: function(element, errorClass) { $(element).removeClass(errorClass); $(element.form).find("label[for=" + element.id +"]").removeClass(errorClass); } }); }); </script> Typical form elements: <label for="first"><span class="rqd">•</span>First Name:</label> <input name="first" id="first" size="25" maxlength="50" class="required" value="" /><br /> <label for="last"><span class="rqd">•</span>Last Name:</label> <input name="last" id="last" size="25" maxlength="50" class="required" value="" /><br /> Thanks... LVR