NoahCode Scenery

Developer
Liam Catherine
Size
1,857 Kb
Views
20,240
  1. NoahCode Scenery Previews
  2. NoahCode Scenery HTML Codes
  3. NoahCode Scenery CSS Codes

How do I make an noahcode scenery?

What is a noahcode scenery? How do you make a noahcode scenery? This script and codes were developed by Liam Catherine on 13 October 2022, Thursday.

NoahCode Scenery Previews
IQ Test

NoahCode Scenery - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>NoahCode Scenery </title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <img class="plane" src="https://noahcode.com.au/icons/transport/plane.png" height="100" width="100">
<img class="helicopter" src="https://noahcode.com.au/icons/transport/rescue_helicopter.png" height="100" width="100">
<img class="car" src="https://noahcode.com.au/icons/transport/jeep.png" height="100" width="100">
<div class="background"></div>
</body>
</html>

NoahCode Scenery - Script Codes CSS Codes

.background { width: 100%; height: 100vh; background: url('https://noahcode.com.au/icons/background.jpg'); background-size: cover; background-repeat-y: no-repeat; background-position-y: 95%; position: absolute;
}
img.plane { position: absolute; z-index: 10; top :0; animation-name: plane_animation; animation-duration: 2s; animation-iteration-count: infinite; animation-timing-function: linear; }
img.helicopter { position: absolute; z-index: 10; animation-name: helicopter_animation; animation-duration: 3s; animation-iteration-count: infinite; animation-timing-function: linear; }
img.car { position: absolute; z-index: 10; bottom: 0; animation-name: car_animation; animation-duration: 5s; animation-iteration-count: infinite; animation-timing-function: linear;
}
@keyframes car_animation { 0% {margin-left: 0%;} 90% {opacity: 1;} 100% {margin-left: 90%;opacity: 0;}
}
@keyframes plane_animation { 0% {margin-left: 0%;} 90% {opacity: 1;} 100% {margin-left: 90%;opacity: 0;}
}
@keyframes helicopter_animation { 0% {margin-left: 0%;top : 30%;} 50% {top : 20%} 90% {opacity: 1;} 100% {margin-left: 90%;top : 30%;opacity: 0;}
}
.animate_car { position: absolute; bottom: 50%;
}
.de_animate_car { position: absolute; bottom: 50%; left: 15%;
}
$("button.animate_car").click(function(){ $("img.car").addClass("animated");
});
$("button.de_animate_car").click(function(){ $("img.car").removeClass("animated");
});
NoahCode Scenery - Script Codes
NoahCode Scenery - Script Codes
Home Page Home
Developer Liam Catherine
Username Bigliam
Uploaded October 13, 2022
Rating 3
Size 1,857 Kb
Views 20,240
Do you need developer help for NoahCode Scenery?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Liam Catherine (Bigliam) Script Codes
Name
Vortex in to new world
404
Codepen
Homework 1
Rotative Loader
A Pen by Liam Catherine
Pokemon battle gameboy style
Google
Battle game
FNAF Newspaper
Create amazing captions with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!