JQuery Validation error message fadein

i need your help. I am not very far from the solution but how can i make the errors messages display with a fade in instead of the normal way. I have this code already, i think i am very close to the solution.

$(document).ready(function() {

    $("#contactform"开发者_高级运维).validate({
  errorPlacement: function(error, element) {
     error.fadeIn('.error');
  },
        messages: {
            contactname: "Required",
            email: "Invalid email",
            comment: "Invalid URL"
        }
    });

});

Instead of:

error.fadeIn('.error');

Try:

$('.error').text(error).fadeIn();

Try this:

$(function() {
    $("#contactForm").validate({
        invalidHandler: function(form, validator) {
            // not sure if this is the correct selector but I found it here: http://docs.jquery.com/Plugins/Validation/validate#toptions
            $(".error").hide().fadeIn("slow");
        },
        messages: {
            contactname: "Required",
            email: "Invalid email",
            comment: "Invalid URL"
        }
    });
});

you can add a section like this in your script below messages

highlight: function (element, errorClass) {                    
                    $('label[for=' + element.id + ']').hide();
                    $('label[for=' + element.id + ']').fadeIn(5000);

                },

your code in jsfiddle does not work. Here is the solution.

errorPlacement: function(error, element) {
        var c = $("<span style='display: none'/>").append(error.html());
        error.empty().append(c);
        setTimeout(function(){ error.children().first().fadeIn("slow");},0);
}

@John Kalberer This worked for me just fine ...

thanks,,

$(function() { $("#contactForm").validate({ invalidHandler: function(form, validator) { // not sure if this is the correct selector but I found it here: http://docs.jquery.com/Plugins/Validation/validate#toptions $(".error").hide().fadeIn("slow"); }, messages: { contactname: "Required", email: "Invalid email", comment: "Invalid URL" } }); });