validating shake loosing it's focus from the control

validating shake loosing it's focus from the control

Hi ,

I am using the jquery to shake animation to validate input box.But when i go on to the control to enter the text, it shakes and the focus is going some where from teh control.

How to keep the focus on the validating control. i am using the following code.

<script type="text/javascript" language="javascript">

        $().ready(function () {
       
            $('#contactForm').validate({          
           
           
                rules: {
                    name: "required",
                    tel: "required",
                  
                },
                messages: {
                    name: "Please enter your Name",
                    tel: "Please enter your Surname",
                  
                   
                },
                highlight: function (element, errorClass, validClass) {
                    $(element).stop()
                            .effect('shake', {times: 4, distance: 5}, 150)
                            .css('border-color', 'Red')
                            .addClass(errorClass)
                            .removeClass(validClass);
                },
                unhighlight: function (element, errorClass, validClass) {
                    $(element).stop()
                    .css('border-color', '#d2d2d2')
                    .addClass(validClass)
                    .removeClass(errorClass);

                },
                errorPlacement: function(error,element){}

            });
        });  

   
    </script>