Calculator Tools Calculator Tools
Create

Monster Truck Upgrade

Sep 8, 2023

About this app

Upgrade your monster truck to go faster in this fun 2D mobile game

Monster Truck Upgrade Monster Truck Upgrade 0 Upgrade Speed

Related apps

Put this on your site

Source

                    <html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">

<title>Monster Truck Upgrade</title>
<meta name="description" content="Upgrade your monster truck to go faster in this fun 2D mobile game">
<meta name="keywords" content="monster truck, game, upgrade, mobile, 2D">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

<script type="text/javascript">
try {
// App Javascript Goes Here. Place your entire script content inside the try block for error handling.
let speed = 0;

// Function to upgrade the monster truck speed
function upgradeSpeed() {
speed += 10;
document.getElementById("speed").innerText = speed;
}

// This will run when the DOM is ready.
document.addEventListener("DOMContentLoaded", function() {
// Display initial speed
document.getElementById("speed").innerText = speed;

// Add event listener to upgrade button
document.getElementById("upgradeBtn").addEventListener("click", upgradeSpeed);
});

} catch (error) {
// This will throw the error to the parent window.
throw error;
}
</script>

<style>
/* App CSS Goes Here */
body {
background-color: #f5f5f5;
font-family: 'Arial', sans-serif;
}

.container {
max-width: 500px;
margin: 0 auto;
padding: 20px;
text-align: center;
}

h1 {
font-size: 24px;
margin-bottom: 20px;
color: #333;
}

.monster-truck {
width: 200px;
margin-bottom: 20px;
}

.speed {
font-size: 48px;
font-weight: bold;
margin-bottom: 20px;
color: #f44336;
}

.upgrade-btn {
background-color: #4caf50;
color: #fff;
font-size: 18px;
font-weight: bold;
padding: 10px 20px;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s ease;
}

.upgrade-btn:hover {
background-color: #45a049;
}
</style>
</head>
<body>
<div id="main-container" class="container">
<h1>Monster Truck Upgrade</h1>
<img src="https://emojicombos.com/wp-content/uploads/2021/01/monster-truck-emoji.png" class="monster-truck">
<p class="speed">0</p>
<button id="upgradeBtn" class="upgrade-btn">Upgrade Speed</button>
</div>
</body>
</html>