JSFiddle - React, Tailwind, and code Playground

HTML

<nav> 
				<a href="Home.html" data-image="http://project-australia.esy.es/Images/Photo-Header-Main2.png" id="Current" title="Home">Home</a> 
				<a href="Trip.html" data-text="A Desert" data-image="http://project-australia.esy.es/Images/Trip.png" title="Trip">Trip</a> 
				<a href="Equipement.html" data-text="A Tent" data-image="http://project-australia.esy.es/Images/Equipement.png" title="Equipement">Equipement</a> 
				<a href="Activities.html" data-text="An Hiking Escurtion" data-image="http://project-australia.esy.es/Images/Activities.png" title="Activities">Activities</a> 
				<a href="Budget.html" data-text="The Australian aircraft company" data-image="http://project-australia.esy.es/Images/Budget.png" title="Budget">Budget</a> 
    <a href="About.html" data-text="The Sydney Opera House" data-image="http://project-australia.esy.es/Images/About.png" title="About">About</a> 
			</nav>
<div class="image"></div>

CSS

.image {
	background: url(http://project-australia.esy.es/Images/Photo-Header-Main2.png);
	background-repeat: no-repeat;
	background-position: 100% 0%;
	position:relative;
	left:-20px;
	width: 104%;
	height: 279px;
	border-radius:17px;
	box-shadow: 4px 4px 10px #1c1a19;
	text-align:left;
    
    transition: background-image 300ms ease;
    -webkit-transition: background-image 300ms ease;
}

a
{
display:inline-block;
font-size:14;
padding:10px;
font-style:Bold;
cursor: url('liens.cur'), pointer;
}

JavaScript

$(document).ready(function(){
					$('nav a').hover(function(){
						$('.image').css('background-image','url('+$(this).data('image')+')');
					});
			});