Gg
Aku<html><meta charset='UTF-8'/><meta content='width=device-width, initial-scale=1, user-scalable=1, minimum-scale=1, maximum-scale=5' name='viewport'/><meta content='IE=edge' http-equiv='X-UA-Compatible'/>
<link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Ubuntu:wght@400;700&display=swap" rel="stylesheet"><link href="https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap" rel="stylesheet"><script src="https://cdn.jsdelivr.net/npm/sweetalert2@11.0.19/dist/sweetalert2.all.min.js"></script>
<!--<link href="https://drive.google.com/uc?export=view&id=" rel="stylesheet" type="text/css" /><script src="https://sesibuk.feeldream.repl.co/script.js"></script>-->
<head>
<title>Script HTML</title>
<!--
Made with love by Rayys!
Blog: https://PalingIT.com
Instagram: @rayyarrr
TikTok: @rayy4r
Email: rayyar0703@gmail.com
Thanks to all <3
-->
</head>
<!-- Edit Wallpaper
di background-image URL --><style>
:root {
--warna-bg: rgba(0, 0, 0, .25);
--warna-teks: white;
--warna-bingkai: rgba(255, 255, 255, .8);
--bingkai: 10px;
--gaya-font: 'Ubuntu', sans-serif;
--gaya-font2: 'Dancing Script', sans-serif;
}
@keyframes fanim {0% {background-position: 0% 0%;}25% {background-position: 100% 100%;} 50% {background-position: 0% 100%;} 75% {background-position: 50% 50%;} 100% {background-position: 0% 0%;}}
body{background-color:#101010;font-family:var(--gaya-font);padding: 25px;-webkit-user-select: none; -ms-user-select: none; user-select: none;} a{text-decoration:none;}
body::before{content:"\00A9 Script HTML Bucin";color:white;opacity:.3;font-size:2vw;position:fixed;bottom:25px;left:25px;z-index:2}
#bodyblur{opacity:1;animation: jj 7s infinite;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.3);z-index:-1;transition:all 1s ease;} #wallpaper{transition:all 3s ease;}
#beneranblur{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.3);-webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px);transition:all 3s ease;}
@keyframes jj{0% {transform: scale(1.1);} 50% {transform: scale(1.2);} 100% {transform: scale(1.1);}}
@keyframes kont{0% {left:-1px; top:-3px;} 50% {left:1px; top:3px;} 100% {left:-1px; top:-3px;}}
blockquote{opacity:0;visibility:hidden;transition:all .3s ease;position:relative;margin-top:120px;margin-left:0;margin-right:0;}
blockquote{width:400px;background:none;border-radius:var(--bingkai);border: 0px solid var(--warna-bingkai);color:var(--warna-teks);text-shadow: 0px 2px 2px rgba(0, 0, 0, .8);text-align:center;line-height:1.3em;padding:25px;}
p{color:var(--warna-teks);font-size:16px;font-weight:700;line-height:1.4em;margin:0px;text-shadow: 0px 2px 2px rgba(0, 0, 0, .8);transition:all .3s ease;}
#kalimat{text-align:center;font-size:16px;font-weight:400;}
#kalimatc{font-family:var(--gaya-font2);font-size:20px;}
#katajawab{font-weight:400;margin:0;display:none;}
@keyframes rto{from {transform:scale(1);} to {transform:scale(1.1);}}
@keyframes aniopa{0% {transform: scale(1);} 50% {transform: scale(.75);} 100% {transform: scale(1);}}
#katabawah{transform:scale(.1);font-size:30px;font-weight:400}
#katatiga{font-size:18px;} #kataempat{font-size:13px;font-weight:400;text-align:right;}
@keyframes rtf{from {transform: rotate(0deg);} to {transform: rotate(360deg);}} @keyframes rt{from {transform: scale(.9);/* transform: rotate(-5deg); */} to {transform: scale(1);/* transform: rotate(5deg); */}}
#bq img{display:none;padding:10px;width:130px;height:130px;margin:20px 0 0 0;}
#bq img:first-child{display:inline-flex}
#akhiran{display:none;color:#FFC700;font-size:14px;text-align:center;background:rgba(0,0,0,.55);text-shadow: 0px;padding:10px;border-radius:var(--bingkai);line-height:10px;transition:all .2s ease;} #akhiran:hover{transform: scale(.9);opacity:.5;}
#pergeseran{opacity:0;visibility:hidden;transition:all 1s ease;display:flex;flex-wrap:nowrap;align-items:flex-start;justify-content:flex-start;position:relative;max-width:500px;padding:0 20px; overflow-y:hidden;overflow-x:scroll;scroll-behavior:smooth;scroll-snap-type:x mandatory; -ms-overflow-style:none;-webkit-overflow-scrolling:touch}
#pergeseran p{background:#003A76;color:white;border: 1px dashed #fff;border-radius:8px;padding:8px;display:flex;flex-wrap:nowrap;text-align:center;font-size:16px;font-weight:700;align-items:center;justify-content:center;flex-shrink:0; width:90%; min-height:130px;margin:0 15px 0 0; scroll-snap-align:center} #pergeseran > *:last-child{margin-right:0} #pergeseran:after{content:'';display:block;flex-shrink:0; align-self:stretch;padding-left:20px}
#pergeseran p b{display:block;} #pergeseran p b img{width:80px;height:80px;margin:20px 0;}
/*#pergeseran p b span{display:flex;}*/
#tm{color:#FFB400;transition:all .5s ease;} #tm:hover{transform: scale(.7);}
#idgeser{position:relative;top:30vh;font-size:17px;color:white}
#Tombol{opacity:0;margin:0;display:flex;align-items:left;list-style:none;transform: scale(.1);transition:all 1s ease;}
#Tombol a{cursor:pointer;display:inline-flex;align-items:center; margin:0;margin:12px 0 12px 0;transition:all .2s ease;padding:10px;outline:0;border-left:2px solid var(--warna-bingkai);border-right:2px solid var(--warna-bingkai); border-radius:0;line-height:15px;background:var(--warna-bg);color:var(--warna-teks);font-size:12px;font-weight:400;white-space:nowrap;overflow:hidden;z-index:1}
#Tombol a:hover{border-left:4px solid var(--warna-bingkai);border-right:4px solid var(--warna-bingkai);transform: scale(.90);opacity:.98;}
#buttonv2{position:absolute;font-size:15px;color:white;background:var(--warna-bg);padding:10px;border-radius:8px;line-height:10px;text-shadow: 0px 2px 2px rgba(0, 0, 0, .8);opacity:0}
.lovein{font-size:50px;display:flex;align-items:center;justify-content:center;transition:all .3s ease;}
.lovein svg{width:80px;height:80px;fill:#fefefe}
.content2{display:block;text-align:center;width:100%;height:180px;margin-top:50px;}
.content2 > *{display:flex;align-items:center;justify-content:center;margin-top:15px;font-size:17px;color:white}
.image img{border-radius:10%;transform:scale(.1);transition:all .8s ease;}
#k2 .image > *{margin-bottom:40px;} #k2{font-weight:700;font-size:17px;color:white;text-shadow: 0px 2px 2px rgba(0, 0, 0, .8);} #final1{transition:all 3s ease;}
#idkirim{font-size:13px;text-shadow: 0px 2px 2px rgba(0, 0, 0, .8);color:white;transition:all .5s ease;}
#idkirim{opacity:0;visibility:hidden;margin-top:100px} #idkirim:hover{transform:scale(.8);}
.content2{display:none;}
#Content{animation-name:none;animation-duration: 3s;animation-iteration-count: infinite;position:relative;opacity:0;margin-top:50px;width:100%;height:180px;transition:all 1.3s ease;}
#Content > *{display:flex;align-items:center;text-align:center;justify-content:center;margin-top:15px;}
#Content img{display:none;background:var(--warna-bg);border:2px solid var(--warna-bingkai);border-radius:50%;padding:10px;width:110px;height:110px;margin:20px 0 0 0;}
#fotoakhir{opacity:.1;transition:all 2s ease;transform: scale(.1);}
#fotolove img{transition:all .5s ease;width:75px;height:75px;padding:0;background:none}
#suratin img{display:inline-flex;background:rgba(255,255,255, 1);border-radius:10%;padding:10px;width:140px;height:110px;transition:all .3s ease;}
#suratin img:hover{transform:scale(.9);}
.swal2-modal > *{font-size:17px;}
.swal2-title{line-height:1.3em;margin-right:10px;margin-left:10px;font-size:17px;text-align:center;padding:15px 30px 0 30px;}
.swal2-timer-progress-bar-container > *{opacity:.5;background:#00B6FF;margin:0 5px}
.swal2-modal{background:rgba(255,255,255,1);border: 1px solid #fff;border-radius:var(--bingkai);top:-60px;}
.fa-heart {opacity:.3;color:white;font-size: 30px;position: absolute;animation: heartMove linear 1;top: -10vh;z-index: 0;}
@keyframes heartMove {0%{transform: translateY(-10vh) ;} 100%{transform: translateY(100vh) ;}}
</style>
<body>
<div id="bodyblur">
<!-- Wallpaper --><img src="https://feeldreams.github.io/rumahan.jpeg" id="wallpaper" width="100%" height="100%"/><div id="beneranblur"></div>
</div>
<div id='Content'>
<div id="suratin" onClick="memulai();audio.play();">
<!-- Surat --><img src="https://rayyscoding.github.io/envelope.png"/>
</div>
<p id="ket">Klik Suratnya!</p>
<div><!-- Foto Akhir Edit di Bagian Bawah--><img src="" id="fotoakhir"/></div>
<div><blockquote id='bq'>
<p id="kalimat"></p>
<p id="kalimatc"></p>
</blockquote></div>
<!-- Tombol Kirim Pesan -->
<div id="Tombol">
<a onClick="sjawab()">
<b>Kirim Pesan</b>
</a>
</div>
</div>
<!-- Jangan Edit Bagian Ini --><script>
function showDiv() {Content.style = "opacity:1;margin-top:15vh;";ket.style="margin-top:30px";}
function memulai(){suratin.style="transition:all 1s ease;transform:scale(.1);opacity:0";ket.style="transition:all 1s ease;transform:scale(.1);opacity:0";setTimeout(pesan,300)}
function kpemb() {bodyblur.style="opacity:.4;animation:none";beneranblur.style="-webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px)";wallpaper.style="transform: scale(1.6)";suratin.style="display:none";ket.style="display:none";fotoakhir.style="display:inline-flex;";setTimeout(ftmuncul,100);Content.style = "opacity:1;margin-top:2vh;";bq.style = "opacity:1;visibility:visible;margin-top:5px";setTimeout(ngetik,500)}
function ftmuncul(){fotoakhir.style.transform="scale(1)";fotoakhir.style.opacity="1";}
function tombol(){Tombol.style="margin-top:15px;opacity:1;transform: scale(1);";ftom=1;} ftom=0; function fakhiran(){document.getElementById("akhiran").style = "display:inline-flex";}
const swals = Swal.mixin({allowOutsideClick: false, cancelButtonColor: '#FF0040', imageWidth: 100, imageHeight: 100,}); const swalst = Swal.mixin({allowOutsideClick: false, showConfirmButton: false, timer: 3000, timerProgressBar: true, imageWidth: 100, imageHeight: 100,}); const style = document.createElement('style'); var today = new Date();var dd = String(today.getDate()).padStart(2, '0');var mm = String(today.getMonth() + 1).padStart(2, '0');var yyyy = today.getFullYear();const monthNames = ["Januari", "Februari", "Maret", "April", "Mei", "Juni", "Juli", "Agustus", "September", "Oktober", "November", "Desember"];today = dd + ' ' + monthNames[today.getMonth()] + ' ' + yyyy;
function setel(){audio.play();} function setel2(){bgm.play();} function sjawab(){if(ftom==1){Tombol.style="display:none";jawab();}}
function otomatis() {befanimkata();setTimeout(animkata,300);} function befanimkata(){kalimatc.style="transform:scale(.3);";} function animkata() {kalimatc.style="transform:scale(1);";}
function kemunculan(){otomatis();kalimatc.innerHTML = ktbwh2;setTimeout(kemunculan2,2200);} function kemunculan2(){otomatis();kalimatc.innerHTML = ktbwh3;setTimeout(kemunculan3,2200);} function kemunculan3(){otomatis();kalimatc.innerHTML = katangetik2;setTimeout(kemunculan,2200);}
var aa=0,katangetik;function ngetik() {if(aa<katangetik.length){kalimat.innerHTML += katangetik.charAt(aa);aa++;setTimeout(ngetik,80);} if(aa==katangetik.length){kalimat.style="margin-bottom:30px";setTimeout(ngetik2,300);}}
var ai=0,katangetik2;function ngetik2() {if(ai<katangetik2.length){kalimatc.innerHTML += katangetik2.charAt(ai);ai++;setTimeout(ngetik2,180);} if(ai==katangetik2.length){setTimeout(kemunculan,2200);setTimeout(tombol,700)}}
async function jawab(){await swals.fire('Kirim pesan ke WhatsApp aku, ya!');window.location = "https://api.whatsapp.com/send?phone=&text=" + pesanwhatsapp;}
</script> <!-- Sampai Sini -->
<!-- Ganti Kata², Foto, Lagu di bawah ya
1) Upload foto ke https://postimages.org
buat dapetin linknya
2) Ganti Lagu Upload ke replit.com
atau bisa juga ke mailboxdrive.com -->
<script type="text/javascript">
async function linkMusik(){
audio = new Audio('https://feeldreams.github.io/menimeni.mp3');setTimeout(showDiv,100);
} linkMusik();
async function pesan(){
await swalst.fire({
title: 'Hai Manis! 😆❤️',
imageUrl: 'https://feeldreams.github.io/bunga.gif',
});
await swalst.fire({
title: 'Btw, kamu lucu banget sii 😆',
imageUrl: 'https://feeldreams.github.io/gumush.gif',
});
var { isConfirmed: prtanya1 } = await swals.fire({
title: `Boleh ga aku gigit? 🤣❤️`,
imageUrl: 'https://feeldreams.github.io/tarikin.gif',
confirmButtonText: 'Boleh',
cancelButtonText: 'Engga', showCancelButton: true,
});
if(prtanya1){varjwb1 = "Boleh";} else {varjwb1 = "Gak boleh";}
await swalst.fire({
title: 'Hehe, Canda aja kok 😆',
imageUrl: 'https://feeldreams.github.io/emawh.gif',
});
await swalst.fire({
title: 'Oh iya, Jaga kesehatanmu ya 😍',
imageUrl: 'https://feeldreams.github.io/g5.gif',
});
await swalst.fire({
title: 'Jangan sampe telat makan 🤬',
imageUrl: 'https://feeldreams.github.io/lompatin.gif',
});
await swalst.fire({
title: 'Nanti lucunya ilang lohh 👉🏻👈🏻',
imageUrl: 'https://feeldreams.github.io/sinisini.gif',
});
fotoakhir.src = "https://feeldreams.github.io/tos.gif";
katangetik = "Dah segitu aja yaa🤣 Makasii udah mau bukain >< ";
katangetik2 = "I love You ❤️";
ktbwh2 = "Jaga kesehatanmu ya 😍";
ktbwh3 = "Jangan sampe sakit 🥺";
pesanwhatsapp = "Aaaa baper ><";setTimeout(kpemb,300);
}
</script>
</body>
</html>