Skip to content

Instantly share code, notes, and snippets.

@pandeyaryan858-tech

pandeyaryan858-tech/index.html

Created December 31, 2025 11:15
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save pandeyaryan858-tech/26487cd5e3838d901f094ef1f0eeeeb1 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save pandeyaryan858-tech/26487cd5e3838d901f094ef1f0eeeeb1 to your computer and use it in GitHub Desktop.
Download ZIP
qENOEXy
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<title>For You 💖</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="screen">
<img id="img" src="https://i.postimg.cc/wj7g53Nv/IMG-0468.png">
<p id="text">Hey! I made something for you 🥺</p>
<button id="yesBtn" onclick="yesClick()">YES</button>
<button id="noBtn" onclick="noClick()">NO</button>
<button id="nextBtn" onclick="next()" style="display:none;">NEXT</button>
<button id="backBtn" onclick="back()" style="display:none;">BACK</button>
</div>
<script src="script.js"></script>
</body>
</html>
Raw
script.js
let img = document.getElementById("img");
let text = document.getElementById("text");
let yesBtn = document.getElementById("yesBtn");
let noBtn = document.getElementById("noBtn");
let nextBtn = document.getElementById("nextBtn");
let backBtn = document.getElementById("backBtn");
let page = 1;
function yesClick() {
page = 2;
document.getElementById("img").src = "https://i.postimg.cc/5tC9VD7S/IMG-0470.png";
document.getElementById("text").innerHTML =
"Hehe! 😍<br>Click below for the surprise!!";
hideAll();
document.getElementById("nextBtn").style.display = "inline-block";
}
function noClick() {
page = 0;
document.getElementById("img").src = "https://i.postimg.cc/g2nCZ8Pn/IMG-0469.png";
document.getElementById("text"). innerText = "HOW DARE YOUUU MOTU 😾!!";
hideAll();
document.getElementById("backBtn").style.display = "inline-block";
}
function back() {
page = 1;
document.getElementById("img").src = "https://i.postimg.cc/Y26yG8Lh/IMG-0468.png";
document.getElementById("text").innerHTML =
"Hey! I made something for you 🥺<br>Will you see it?";
hideAll();
document.getElementById("yesBtn").style.display = "inline-block";
document.getElementById("noBtn").style.display = "inline-block";
}
function next() {
if (page === 2) {
page = 3;
document.getElementById("img").src = "https://i.postimg.cc/SNyr3hTp/IMG-0471.png";
document.getElementById("text").innerHTML =
"Happy New Year my motu😘!!! 💖<br>Click on the gift box 🎁";
}
else if (page === 3) {
page = 4;
document.getElementById("img").src = "https://i.postimg.cc/vT6sdnH1/IMG-0472.png";
document.getElementById("text").innerHTML =
"SMILEEEEE 😁<br>Click on the camera to reveal message!! 📸";
}
else if (page === 4) {
page = 5;
document.getElementById("img").src = "https://i.postimg.cc/638rt6s1/03F6A5B4-B32A-4791-A9F7-E770C1DEFAE3.jpg";
document.getElementById("text").innerHTML =
`Happy New Year motu ❤️<br>
Ye naya saal hum dono ke liye aur zyada pyaar hasi aur beautiful memories leke aaye.<br>
Hamesha aise hi mere sath rehna.<br>
Is saal bhi har subah tumhare khayalon se shuru ho<br>
aur har raat tumhari baaton pe khatam.<br>
I love youuuu so much babyyyyy 😘`;
document.getElementById("nextBtn").style.display = "none";
}
}
function hideAll() {
document.getElementById("yesBtn").style.display = "none";
document.getElementById("noBtn").style.display = "none";
document.getElementById("nextBtn").style.display = "none";
document.getElementById("backBtn").style.display = "none";
}
Raw
style.css
body {
text-align: center;
font-family: Arial;
background: #fff0f5;
}
img {
width: 280px;
margin-top: 20px;
}
button {
padding: 10px 22px;
margin: 10px;
border-radius: 15px;
font-size: 16px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment