Untitled
unknown
plain_text
10 months ago
1.6 kB
3
Indexable
To achieve this, you can use HTML, CSS, and JavaScript. Here's a simple implementation:
Code Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Happy New Year</title>
<style>
#saika {
font-size: 24px;
color: blue;
cursor: pointer;
}
#message {
margin-top: 20px;
font-size: 20px;
color: green;
}
</style>
</head>
<body>
<div id="saika">SAIKA</div>
<div id="message"></div>
<script>
// Get the SAIKA element and message container
const saikaElement = document.getElementById("saika");
const messageElement = document.getElementById("message");
// Add a click event listener to display the message
saikaElement.addEventListener("click", function () {
messageElement.textContent = "HAPPY NEW YEAR";
});
</script>
</body>
</html>
How It Works:
1. HTML:
The div with id="saika" displays the clickable text "SAIKA".
The div with id="message" is initially empty and will display the message when "SAIKA" is clicked.
2. CSS:
Adds styling to make "SAIKA" look clickable (blue color, larger font, and pointer cursor).
Styles the message to appear prominently.
3. JavaScript:
Listens for a click event on the "SAIKA" text.
Updates the content of the #message element to "HAPPY NEW YEAR".
Steps to Use:
1. Copy and paste this code into a .html file.
2. Open the file in a web browser.
3. Click on "SAIKA" to see the "HAPPY NEW YEAR" message appear.
Editor is loading...
Leave a Comment