<script type="text/javascript" src="path/to/jquery.js"></script>

<div class="contact_form">
<div class="form_row">
<label class="contact">name:</label>

<input type="text" class="contact_input" />
</div>

<div class="form_row">
<label class="contact">email:</label>
<input type="text" class="contact_input" />
</div>

<div class="form_row">
<label class="contact">phone:</label>

<input type="text" class="contact_input" />
</div>


<div class="form_row">
<label class="contact">message:</label>
<textarea class="contact_textarea" rows="" cols="" ></textarea>
</div>


<div class="form_row">
<input type="image" src="images/send.gif" class="send"/>
</div>
</div>

<div class="contact_form">
<form method="POST" action="contact.php" enctype="multipart/form-data">
<div class="form_row">
<label class="contact" for="name">name:</label>
<input type="text" class="contact_input" name="name" />
</div>

<div class="form_row">
<label class="contact" for="email">email:</label>
<input type="text" class="contact_input" name="email" />
</div>

<div class="form_row">
<label class="contact" for="phone">phone:</label>

<input type="text" class="contact_input" name="phone" />
</div>


<div class="form_row">
<label class="contact" for="message">message:</label>
<textarea class="contact_textarea" rows="" cols="" name="message" ></textarea>
</div>


<div class="form_row">
<input type="image" src="images/send.gif" class="send"/>
</div>
</form>
</div>

<?php
// Define variables according to parameters
$name = $_POST['name'];
$email = $_POST['email'];
$phone = $_POST['phone'];
$message = $_POST['message']

// Define a variable to count how many fields were submitted (posted)
$count = count($_POST);

// Now, if the count of the field submitted is greater than zero (or, not empty), submit the form
if ($count > 0) {
// Let's check for some errors. All of this simply checks if all fields are empty or if at least one of them are empty, and if so, redirect to an error page (which you should make).

if ((!$name && !$email && !$phone && !$message) || (!$name || !$email || !$phone || !$message)) {
header ('Location: http://www.hannibalinfo.com/error.html');
}

// Now, if there aren't any errors with null or empty fields, check also if the email address is valid.

else if (!$email == "" && (!strstr($email,"@") || !strstr($email,"."))) {
header ('Location: http://www.hannibalinfo.com/error.html');
}

// Otherwise, submit the data and mail it to an email address.
else {
// Define the neccessary variables needed to email a message.
$to = 'contact@hannibalinfo.com';
$subject = 'New Message';
$message = "A new message has arrived. Refer below to read it.\n\n\"$message\"\n\n";
$from = "From: $name $email\r\n";

// Now, use the mail function to send the message contents and information.
mail ($to, $subject, $message, $from);

// Once finished, redirect to a success page (which you should make as well).
header ('Location: http://www.hannibalinfo.com/success.html');
}
}

// Just in case error checking for empty fields didn't work, redirect to error page.
else {
header ('Location: http://www.hanibbalinfo.com/error.html');
}
?>

<label for="form-name">Name</label> <input id="form-name" />

<script type="text/javascript" src="/path/to/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() { // This initiates functions when the document finishes loading
$('#submit') // This tells jQuery to listen for actions on the element with the "submit" ID
.click(function() { // jQuery listens for when the "submit" button is clicked

// For each of the variables, you're telling jQuery to get the value
// of the input field with a certain name
var name = $('input[name=name]').val();
var email = $('input[name=email]').val();
var phone = $('input[name=phone]').val();
var message = $('textarea[name=message]').val();

// This is where you'll send the data to the server
$.ajax({

// This is the URL that processes the form data
url : 'send.php',

// This is the submit method you'll use
type : 'POST',

// This sends the data, which is a compilation
// of the variables you defined earlier
data : 'name=' + name + '&email=' + email + '&phone=' + phone + '&message=' + message,

// This is the function to run if the submission was successful
// If it was successful, "html" will have a value of 1
success: function(html) {
// If it was successful, hide the form and show the success message
if(html == 1) {
$('#form, #error').hide('slow');
$('#done').html('Type your success message here.').show('slow');
}
// If it was unsuccessful, show the error message
else $('#error').html('Type your error message here.').show('slow');
}

});

});
});
</script>

<p id="error" style="display:none;"></p>
<p id="done" style="display:none;"></p>
<form id="form">
<p><label>Name:</label> <input name="name" /></p>
<p><label>Email:</label> <input name="email" /></p>
<p><label>Phone:</label> <input name="phone" /></p>
<p><label>Message:</label> <textarea name="message"></textarea></p>
<p><input id="submit" type="submit" /></p>
</form>

<!--[if IE 6]>
    <script type="text/javascript" src="unitpngfix.js"></script>

<![endif]-->

<!--[if IE 6]>
<![endif]-->

<script type="text/javascript" src="/js/jquery.js"></script>

$to = 'contact@hannibalinfo.com';

mail ($to, $subject, $message, $from);