first commit

3 years ago · a7324b15c6
commit a7324b15c6
5 changed files with 59 additions and 0 deletions
--- a/assets/shark.png
+++ b/assets/shark.png
--- a/assets/you-tiao-chinese-donut-cakwe-vegan-friendly-recipe-main-photo.jpg
+++ b/assets/you-tiao-chinese-donut-cakwe-vegan-friendly-recipe-main-photo.jpg
--- a/index.html
+++ b/index.html
@ -0,0 +1,28 @@
 <!DOCTYPE html>
 <html lang="en">
 	<head>
 		<meta charset="UTF-8" />
 		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
 		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
 		<title>IMGSSS</title>
 		<link rel="stylesheet" href="style.css" />
 		<script src="script.js" defer></script>
 	</head>
 	<body>
 		<main>
 			Esse ad consequat minim irure anim dolore duis. Nulla reprehenderit amet nulla cupidatat
 			aliquip mollit culpa aliquip culpa proident eiusmod. Elit sit ut et est minim est sunt
 			excepteur ea ad excepteur consequat occaecat. Aliqua aute tempor consectetur ut et ex
 			quis non voluptate cupidatat id do minim. Nisi duis irure exercitation sint nulla veniam
 			amet esse. Irure reprehenderit aliqua occaecat esse eu dolore esse amet do laborum
 			cillum. Commodo id ut mollit culpa occaecat.
 		</main>
 		<div id="container">
 			<img src="./assets/shark.png" style="left: 32%; top: 43%" />
 			<img
 				src="./assets/you-tiao-chinese-donut-cakwe-vegan-friendly-recipe-main-photo.jpg"
 				style="left: 50%; top: 23%"
 			/>
 		</div>
 	</body>
 </html>
--- a/script.js
+++ b/script.js
@ -0,0 +1,16 @@
 const container = document.getElementById("container");
 // console.log(container.children);
 let images = Array.from(container.children);
 // console.log(images);
 // for (index in images) {
 // 	console.log(images[index]);
 // }
 images.forEach((image) => {
 	left = Math.random() * 100;
 	top = Math.random() * 100;
 	image.style.left = left + "%";
 	image.style.top = top + "%";
 });
--- a/style.css
+++ b/style.css
@ -0,0 +1,15 @@
 main {
 	font-size: 2rem;
 }
 #container {
 	position: absolute;
 	left: 0;
 	top: 0;
 	width: 100%;
 	height: 100%;
 }
 #container img {
 	position: absolute;
 }