Create an interactive SVG background pattern in website

. 

The background of the website updated by adding an interactive SVG background pattern

“e” symbols image patterns rotating and interacting with the cursor, based on movement. 

Code used to display an image repeatedly in entire screen just like a pattern and rotate each image according to the movement of the cursor.

<div class="header-top-banner-image-background" id="header-top-banner-image-background">
	<centre>
	<div class="header-top-banner-image" id="header-top-banner-image">
	
		<div class="header-top-banner-image-content">
			<div class="header-top-banner-image-container ">
				<hr class="banner-horizon">
				</hr>
				<h1>Choose your website</h1>
				<div class="button-div" style="display: block;">
					<a href="https://www.enlightenprofessional.tk/" target="_blank"
						class="banner-button dental-prof">I’m a Dental Professional</a>
				</div>
				<div class="button-div" style="display: block;">
					<a href="/" target="_blank" class="banner-button patient">I’m a Patient</a>
				</div>
			</div>
		</div>
	</div>
</centre>
</div>

<script>

	$(document).ready(function () {
		// var left= 0;
		var top = 20;
		var width = window.innerWidth;
		for (var i = 0; i < 13; i++) {
			var left = 10;
			for (var j = 0; j < 25; j++) {
				if(left<width-35){
				var img = '<img id="cow" src="https://www.enlightenprofessional.tk/SSP%20Applications/NetSuite%20Inc.%20-%20SCA%202021.2.0/Development/img/EN_icon.png" class="cow" style="position: absolute; top: ' + top + 'px; left:' + left + 'px; filter: opacity(0.11);"/>';
				$("body #header-top-banner-image").append(img);
				left = left + 72;
			
			}
				
		
			}
			top = top + 70;
		}
	
	})
	$(document).on("mousemove", function (event) {

		var mouseX = event.originalEvent.pageX;
		var mouseY = event.originalEvent.pageY;

		$("img.cow").each(function () {
			var imgX = $(this).position().left + 70;
			var imgY = $(this).position().top + 70;
			var diffX = mouseX - imgX;
			var diffY = mouseY - imgY;
			var radians = Math.atan2(diffY, diffX);
			var angle = radians * 180 / Math.PI;
			$(this).css("transform", "rotate(" + angle + "deg)")
		});

	});

</script>