function changePage (element){
	var elementClass = element.parent().attr("class");
	nextPage = Number(elementClass.substr(elementClass.length-1)   ); 
	changePageArrow(nextPage);
 
}

function changePageArrow(nextPage){
	$("#howtoelement"+page).fadeOut("slow", function() {
		$("#howtoelement"+nextPage).fadeIn("slow");
	});
	$(".navigator span.pagenumber a").removeClass("pagenumberon" );
	$(".navigator span.pagenumber" + nextPage + " a").addClass("pagenumberon"); 
	page = nextPage;   
}

function pageBack() {
	nextPage = page -1;
	if(nextPage <= 0){

	} else {
		changePageArrow(nextPage); 
	}
	
}

function pageFwd() {
	nextPage = page +1;
	if(nextPage > totpages){
	
	} else {
		changePageArrow(nextPage); 
	}
	return false;
}


$(document).ready(function () { 
	$(".navigator span.pagenumber a").bind("click", function () {
		changePage($(this));
		return false;
	});
	$(".pageback").bind("click", function () {
		pageBack();
		return false;
	});
	$(".pagefwd").bind("click", function () {
		pageFwd();
		return false;
	});
	 
});