Untitled

$(function () {
	$("#homeButton").click(function (event) {
    $("#homeDiv").show();
    $("#yourTracksDiv").hide();
		$("#profileDiv").hide();
		$("#headerHomeDiv").show();
    $("#headerYourTracksDiv").hide();
		$("#headerProfileDiv").hide();
	});
	$("#yourTracksButton").click(function (event) {
    $("#homeDiv").hide();
    $("#yourTracksDiv").show();
		$("#profileDiv").hide();
		$("#headerHomeDiv").hide();
    $("#headerYourTracksDiv").show();
		$("#headerProfileDiv").hide();
	});
	$("#profileButton").click(function (event) {
		$("#homeDiv").hide();
    $("#yourTracksDiv").hide();
		$("#profileDiv").show();
		$("#headerHomeDiv").hide();
    $("#headerYourTracksDiv").hide();
		$("#headerProfileDiv").show();
	});
});
---------------------------------------------------------------------
input[type=text] {
	width: 130px;
	-webkit-transition: width 0.4s ease-in-out;
	transition: width 0.4s ease-in-out;
}
body{
	overflow: hidden;
}
#headerHomeDiv{
  position: absolute;
	background-color: black;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 99%;
  height: 97%;
}
#headerYourTracksDiv{
  position: absolute;
	background-color: black;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 99%;
  height: 97%;
}
#headerProfileDiv{
  position: absolute;
	background-color: black;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 99%;
  height: 97%;
}
#homeDiv{
	position: absolute;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 99%;
  height: 97%;
}
#yourTracksDiv{
	position: absolute;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 99%;
  height: 97%;
}
#profileDiv{
	position: absolute;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 99%;
  height: 97%;
}
#searchDiv{

}
------------------------------------------------------------------
<!DOCTYPE html>
<html lang="en">
	<head>
		<title>Aria</title>
		<link rel="icon" href="../stockHack/images/icon.ico" />
		<meta charset="UTF-8">
		<script src="js/libraries/jquery-3.2.1.js"></script>
  	<script src="js/libraries/jquery-ui-1.12.1.custom/jquery-ui-1.12.1.custom/jquery-ui.js"></script>
		<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjs/3.13.3/math.js"></script>
		<script src="js/main.js"></script>
		<link rel="stylesheet" href="js/libraries/jquery-ui-1.12.1.custom/jquery-ui-1.12.1.custom/jquery-ui.css">
		<link rel="stylesheet" href="css/design.css">
	</head>
	<body>
		<div id='homeDiv'>
			<div id='headerHomeDiv'>
				<button id='homeButton'>Home</button>
				<button id='yourTracksButton'>Your Tracks</button>
				<button id='profileButton'>Profile</button>
			</div>
			<div id='searchDiv'>
				<input type="text" name="search" placeholder="Search...">
			</div>
		</div>
		<div id='yourTracksDiv'>
			<div id='headerYourTracksDiv'>
				<button id='homeButton'>Home</button>
				<button id='yourTracksButton'>Your Tracks</button>
				<button id='profileButton'>Profile</button>
			</div>
		</div>
		<div id='profileDiv'>
			<div id='headerProfileDiv'>
				<button id='homeButton'>Home</button>
				<button id='yourTracksButton'>Your Tracks</button>
				<button id='profileButton'>Profile</button>
			</div>
		</div>
	</body>
</html>