formAjax.js

$('#theContactForm').submit(function(e){

     var fullName = $("#name").val();
     var sEmail = $('#email').val();
     var subject = $('#subject').val();
     var message = $('#message').val();
     
     if(fullName == ""){
      $('#name').css('border','1px solid red');
     } else {
     	$('#name').css('border','1px solid #fff');
     }
     if(sEmail == ""){
      $('#email').css('border','1px solid red');
     } else {
     	$('#email').css('border','1px solid #fff');
     }
     if(subject == ""){
      $('#subject').css('border','1px solid red');
     } else {
     	$('#subject').css('border','1px solid #fff');
     }
     if(message == ""){
      $('#message').css('border','1px solid red');
     } else {
     	$('#message').css('border','1px solid #fff');
     }
     
     if(fullName.trim() == "" || sEmail.trim() == "" || subject.trim() == "" || message.trim() == ""){
         $(".error").fadeIn(200);
         e.preventDefault();        
     } else { 
       // prevent default ( prevent form from reloading page on submit ) 
     	e.preventDefault();
     // post it via proccessed 
     	$.post("processed.php", { 
     // assign js variable to php variables found in proccessed php
		name: fullName,
		email: sEmail,
		subject: subject,
		theMessage: message
	}, function(data, status){
		$(".error").hide();
		$("#thanks").html("Thank you " + fullName + " for the message.");
		 $('.contactForm').animate({right: '-100%'});
		document.getElementById("theContactForm").reset();
		$('.success').fadeIn();
		
	});    	
     }
    
   
});

formAjaxProccess.php

<?php 
if(isset($_POST)){
    $name = htmlspecialchars($_POST['name']);
    $email = htmlspecialchars($_POST['email']);
    $subject = htmlspecialchars($_POST['subject']);
    $theMessage = htmlspecialchars($_POST['message']);

    $to = "email@hotmail.com"; // this is your Email address
    $subjectHead = "Form submission";
    $subjectHead2 = "Copy of your form submission";
    $message =  $name . " wrote the following:" . "\n\n" . $theMessage;
    $message2 = "Here is a copy of your message " . $name . "\n\n" . $theMessage;

    $headers = "From:" . $email;
    $headers2 = "From:" . $to;
    mail($to,$subject,$message,$headers);
    mail($email,$subjectHead2,$message2,$headers2); // sends a copy of the message to the sender
    
    }
    
?>

formAjaxSubmit.php

<div class='contactForm'>
       <form action='' method="POST" id='theContactForm'>
            <br style="clear:both">
            <h3 style="margin-bottom: 25px; text-align: center;">message me</h3>
            <div class="form-group">
                	<input type="text" class="form-control" id="name" name="name" placeholder="Name">
            </div>
            <div class="form-group">
              		<input type="email" class="form-control" id="email" name="email" placeholder="Email">
            </div>
            <div class="form-group">
             		 <input type="text" class="form-control" id="subject" name="subject" placeholder="Subject">
            </div>
            <div class="form-group">
              		<textarea class="form-control" type="textarea" id="message" placeholder="Message" maxlength="1540" rows="7" name="message"></textarea>
             </div>
        		<input type="submit" id="submit1" name="submit" value="submit" class="btn btn-primary pull-right" />
     </form>
  </div>