$(function() {
	
	//  Jeditable
	$(".edit_area")
		.editable(
			'update_section.php', 
			{
    		id : "name",
    		name : "content",
    		submitdata : {update_section: "update_section"},
    		type      : "textarea",
  			submit    : 'Edit',
  			cancel    : 'Cancel',
  			tooltip   : "Click to edit...",
  			onblur    : "ignore",
  			cssclass  : 'edit',
  			width     : 'none',
  			height    : 'none'
			}
	)
	// When clicking the editable area
	.click(
		function() {
			// wrap a div around the buttons for styling purposes
  			$(this).find('button').not('div.buttons button').wrapAll('<div class="buttons"></div>');
  		}	
	)
	// When hovering over the editable area
	.hover(
		// mouseover
		function() {
			$(this).toggleClass('edit_hover');
    	}, 
		// mouseout
		function() {
    		$(this).toggleClass('edit_hover');
    	}
	);
	
	// When clicking either submit or cancel in the edit area
	$('.edit_area div.buttons button')
	.click(
		function() {
			$(this).closest('.edit_area').removeClass('edit_hover');
   	 	}
	 );

}); // end jquery