JSFiddle - React, Tailwind, and code Playground

HTML

<div id="menu">
	<ul id="Navigation">
        <li><a href="#" onmouseover="swapNews()">NEWS</a></li>
        <li><a href="#" onmouseover="swapKurse()">KURSE</a></li>
        <li><a href="#" onmouseover="swapUberuns()">&Uuml;BER UNS</a></li>
	</ul>
</div>

CSS

body {
	font-family: 'Roboto', 'verdana';
    color: black; 
	background-color: #000000;
	background: url(http://lorempixel.com/output/abstract-q-c-640-480-9.jpg) no-repeat center center fixed;
    background-size: cover;
  }

JavaScript

function swapNews()
	{	document.body.style.backgroundImage="url(http://lorempixel.com/output/abstract-q-c-640-480-2.jpg)";
	}
	function swapKurse()
	{	document.body.style.backgroundImage="url(http://lorempixel.com/output/abstract-q-c-640-480-10.jpg)";
	}
	function swapUberuns()
	{     document.body.style.backgroundImage="url(http://lorempixel.com/output/abstract-q-g-640-480-4.jpg)";
	}