|
|
<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="icon" |
|
|
type="image/svg+xml" |
|
|
href="/icon.jpg" |
|
|
/> |
|
|
<link |
|
|
rel="apple-touch-icon" |
|
|
href="/icon.jpg" |
|
|
/> |
|
|
|
|
|
<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=Quicksand:wght@400;700&display=swap" |
|
|
rel="stylesheet" |
|
|
/> |
|
|
<link |
|
|
href="https://fonts.googleapis.com/css2?family=Caveat&display=swap" |
|
|
rel="stylesheet" |
|
|
/> |
|
|
<link |
|
|
href="https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;700&display=swap" |
|
|
rel="stylesheet" |
|
|
/> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<script |
|
|
src="https://kit.fontawesome.com/4f3ce16e3e.js" |
|
|
crossorigin="anonymous" |
|
|
></script> |
|
|
|
|
|
<script src="https://unpkg.com/typeit@8.7.0/dist/index.umd.js"></script> |
|
|
|
|
|
<script src="https://unpkg.com/scrollreveal"></script> |
|
|
|
|
|
<head> |
|
|
<title>Aku Buat Khusus Buat Kamu</title> |
|
|
<meta name="description" content="Web Khusus Buat Kamu" /> |
|
|
</head> |
|
|
<style> |
|
|
:root { |
|
|
--gaya-font: "Quicksand", sans-serif; |
|
|
--gaya-font2: "Nunito Sans", sans-serif; |
|
|
--gaya-font3: "Caveat", cursive; |
|
|
} |
|
|
body { |
|
|
overflow: hidden; |
|
|
background: #000; |
|
|
font-family: var(--gaya-font); |
|
|
margin: 0; |
|
|
} |
|
|
body::before { |
|
|
content: "\00A9 IkyyOFC | Diki P.W."; |
|
|
color: white; |
|
|
opacity: 0.5; |
|
|
font-size: 10px; |
|
|
position: fixed; |
|
|
bottom: 25px; |
|
|
right: 25px; |
|
|
z-index: 150; |
|
|
} |
|
|
@keyframes jj { |
|
|
0% { |
|
|
transform: scale(1.2); |
|
|
} |
|
|
50% { |
|
|
transform: scale(1.5); |
|
|
} |
|
|
100% { |
|
|
transform: scale(1); |
|
|
} |
|
|
} |
|
|
@keyframes rto { |
|
|
from { |
|
|
transform: scale(1); |
|
|
} |
|
|
to { |
|
|
transform: scale(1.1); |
|
|
} |
|
|
} |
|
|
#counter { |
|
|
position: fixed; |
|
|
color: white; |
|
|
font-size: 11px; |
|
|
top: 20px; |
|
|
left: 20px; |
|
|
z-index: 999; |
|
|
} |
|
|
|
|
|
section { |
|
|
position: relative; |
|
|
z-index: 99; |
|
|
padding: 0; |
|
|
height: 100vh; |
|
|
display: flex; |
|
|
flex-direction: column; |
|
|
align-items: left; |
|
|
text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.8); |
|
|
border-top: 1px solid #fff; |
|
|
} |
|
|
section { |
|
|
background: #000; |
|
|
background-image: var(--bg); |
|
|
background-attachment: fixed; |
|
|
background-position: center; |
|
|
background-repeat: no-repeat; |
|
|
background-size: cover; |
|
|
} |
|
|
section.first { |
|
|
border-top: 0 solid #fff; |
|
|
} |
|
|
section.first > img { |
|
|
opacity: 0; |
|
|
} |
|
|
section:nth-child(even) { |
|
|
color: white; |
|
|
} |
|
|
section:nth-child(odd) { |
|
|
color: white; |
|
|
} |
|
|
section > :first-child { |
|
|
margin-top: 150px; |
|
|
} |
|
|
|
|
|
.stiker { |
|
|
margin-left: auto; |
|
|
margin-right: auto; |
|
|
box-shadow: 0 4px 30px rgba(255, 255, 255, 0.3); |
|
|
backdrop-filter: blur(5px); |
|
|
-webkit-backdrop-filter: blur(5px); |
|
|
width: 90px; |
|
|
height: 90px; |
|
|
background: rgba(255, 255, 255, 0.7); |
|
|
border: 1px solid rgba(255, 255, 255, 0.3); |
|
|
border-radius: 50%; |
|
|
padding: 10px; |
|
|
margin-bottom: 20px; |
|
|
transition: all 0.85s ease; |
|
|
} |
|
|
section .wp img { |
|
|
position: absolute; |
|
|
top: 0; |
|
|
left: 0; |
|
|
width: 100%; |
|
|
height: 100%; |
|
|
padding: 0; |
|
|
background: none; |
|
|
border: none; |
|
|
} |
|
|
section .wp::after { |
|
|
content: ""; |
|
|
position: absolute; |
|
|
top: 0; |
|
|
left: 0; |
|
|
right: 0; |
|
|
bottom: 0; |
|
|
background: rgba(0, 0, 0, 0.7); |
|
|
} |
|
|
#stikerakhir { |
|
|
margin-top: -60px; |
|
|
} |
|
|
#stikerdua { |
|
|
display: none; |
|
|
} |
|
|
|
|
|
h1 { |
|
|
font-size: 2rem; |
|
|
} |
|
|
.lingkar { |
|
|
font-weight: 400; |
|
|
border-bottom: 1px solid #ff0900; |
|
|
} |
|
|
h1, |
|
|
h2, |
|
|
h3, |
|
|
h4, |
|
|
h5 { |
|
|
margin: 0; |
|
|
text-align: center; |
|
|
margin: 1rem 0; |
|
|
} |
|
|
p { |
|
|
color: white; |
|
|
font-size: 15px; |
|
|
font-family: var(--gaya-font2); |
|
|
line-height: 1.5em; |
|
|
text-align: center; |
|
|
} |
|
|
a { |
|
|
color: white; |
|
|
text-decoration: none; |
|
|
transition: all 0.3s ease-in-out; |
|
|
&:hover, |
|
|
&:focus, |
|
|
&:active { |
|
|
color: #f1e8d9; |
|
|
} |
|
|
} |
|
|
#hsatu { |
|
|
transition: all 0.3s ease; |
|
|
} |
|
|
#judulakhir { |
|
|
z-index: 100; |
|
|
font-size: 24px; |
|
|
font-family: var(--gaya-font3); |
|
|
transition: all 0.5s ease; |
|
|
} |
|
|
#teksnimasisatu, |
|
|
#teksnimasi, |
|
|
#kalimatakhir, |
|
|
#palingakhir { |
|
|
z-index: 100; |
|
|
margin-right: auto; |
|
|
margin-left: auto; |
|
|
font-size: 15px; |
|
|
font-family: var(--gaya-font2); |
|
|
} |
|
|
#teksnimasisatu, |
|
|
#teksnimasi { |
|
|
text-align: center; |
|
|
margin-left: 70px; |
|
|
margin-right: 70px; |
|
|
} |
|
|
#teksnimasi { |
|
|
font-size: 17px; |
|
|
} |
|
|
.tipeA { |
|
|
font-family: var(--gaya-font); |
|
|
} |
|
|
|
|
|
svg { |
|
|
vertical-align: middle; |
|
|
width: 22px; |
|
|
height: 22px; |
|
|
fill: #fff; |
|
|
} |
|
|
.menu { |
|
|
position: fixed; |
|
|
bottom: 15vh; |
|
|
width: 100%; |
|
|
z-index: 999; |
|
|
display: flex; |
|
|
justify-content: center; |
|
|
align-items: center; |
|
|
transition: all 1s ease; |
|
|
} |
|
|
.tombol { |
|
|
background-color: rgba(255, 255, 255, 0.25); |
|
|
border-radius: 50px; |
|
|
overflow: hidden; |
|
|
display: flex; |
|
|
align-items: center; |
|
|
justify-content: center; |
|
|
width: 45px; |
|
|
height: 45px; |
|
|
-webkit-transition: all 0.2s ease-out; |
|
|
transition: all 0.2s ease-out; |
|
|
} |
|
|
.tombol svg { |
|
|
margin: auto; |
|
|
fill: #fff; |
|
|
} |
|
|
|
|
|
#Tombol, |
|
|
#TombolWA { |
|
|
position: relative; |
|
|
opacity: 0; |
|
|
margin-left: auto; |
|
|
margin-right: auto; |
|
|
display: flex; |
|
|
align-items: left; |
|
|
list-style: none; |
|
|
transition: all 1s ease; |
|
|
} |
|
|
#Tombol a, |
|
|
#TombolWA a { |
|
|
cursor: pointer; |
|
|
display: inline-flex; |
|
|
align-items: center; |
|
|
margin: 0; |
|
|
margin: 10px; |
|
|
transition: all 0.2s ease; |
|
|
padding: 10px; |
|
|
outline: 0; |
|
|
border: 1px solid white; |
|
|
border-radius: 8px; |
|
|
line-height: 15px; |
|
|
background: rgba(0, 0, 0, 0.5); |
|
|
color: white; |
|
|
font-size: 13px; |
|
|
font-weight: 700; |
|
|
white-space: nowrap; |
|
|
overflow: hidden; |
|
|
box-shadow: rgba(255, 255, 255, 0.15) 0px 7px 29px 0px; |
|
|
z-index: 1; |
|
|
} |
|
|
|
|
|
.overlay { |
|
|
position: fixed; |
|
|
top: 0; |
|
|
left: 0; |
|
|
width: 100%; |
|
|
height: 100%; |
|
|
display: flex; |
|
|
justify-content: center; |
|
|
align-items: center; |
|
|
background: #000; |
|
|
z-index: 100; |
|
|
} |
|
|
.loading-message { |
|
|
font-size: 13px; |
|
|
text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.8); |
|
|
color: white; |
|
|
text-align: center; |
|
|
} |
|
|
|
|
|
#counter { |
|
|
position: fixed; |
|
|
color: white; |
|
|
font-size: 11px; |
|
|
top: 20px; |
|
|
left: 20px; |
|
|
z-index: 999; |
|
|
} |
|
|
.fa-heart { |
|
|
opacity: 0.3; |
|
|
color: white; |
|
|
font-size: 20px; |
|
|
position: fixed; |
|
|
animation: heartMove linear 1; |
|
|
top: -10vh; |
|
|
z-index: 999; |
|
|
} |
|
|
@keyframes heartMove { |
|
|
0% { |
|
|
transform: translateY(-10vh); |
|
|
} |
|
|
100% { |
|
|
transform: translateY(100vh); |
|
|
} |
|
|
} |
|
|
</style> |
|
|
<body> |
|
|
<div class="overlay"> |
|
|
<div class="loading-message"> |
|
|
sabar yaa babee<br />masih loading, jaringanmu jelek |
|
|
mungkin:v<br />awokawokawok |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<audio |
|
|
src="/angel.mp3" |
|
|
id="linkmp3" |
|
|
class="sembunyi" |
|
|
></audio> |
|
|
|
|
|
<section class="first" onclick="playaud()"> |
|
|
<div class="wp"> |
|
|
<img |
|
|
id="imgsatu" |
|
|
src="https://feeldreams.github.io/pics/awan/1.jpg" |
|
|
/> |
|
|
</div> |
|
|
<img |
|
|
id="first_stiker" |
|
|
class="stiker fade-in" |
|
|
src="https://feeldreams.github.io/bunga.gif" |
|
|
/> |
|
|
<h2 class="title">hawloooo babeeee!</h2> |
|
|
<h4 class="title"><i>aku mau bilang sesuatu 😏</i></h4> |
|
|
<p class="slide-up"><i>scroll kebawah babee!!</i></p> |
|
|
</section> |
|
|
|
|
|
<section> |
|
|
<div class="wp"> |
|
|
<img |
|
|
id="imgtiga" |
|
|
src="https://feeldreams.github.io/pics/awan/3.jpg" |
|
|
/> |
|
|
</div> |
|
|
<img |
|
|
class="stiker fade-in" |
|
|
src="https://feeldreams.github.io/pusn.gif" |
|
|
/> |
|
|
<h3 class="title"> |
|
|
why do stars still shine<br />even though far away? |
|
|
</h3> |
|
|
<p id="teksnimasisatu"> |
|
|
cause like my feels for you, it finally gets here even if i |
|
|
gotta wait for a long time. |
|
|
</p> |
|
|
</section> |
|
|
|
|
|
<section> |
|
|
<div class="wp"> |
|
|
<img |
|
|
id="imgdua" |
|
|
src="https://feeldreams.github.io/pics/awan/2.jpg" |
|
|
/> |
|
|
</div> |
|
|
<img |
|
|
class="stiker fade-in" |
|
|
src="https://feeldreams.github.io/cilukba.gif" |
|
|
/> |
|
|
<h3 class="title"> |
|
|
anyway<br />aku ada pertanyaan 😼<br />tapi jangan terlalu |
|
|
dipikirin yaa!!! |
|
|
</h3> |
|
|
</section> |
|
|
|
|
|
<section> |
|
|
<div class="wp"> |
|
|
<img |
|
|
id="imglima" |
|
|
src="https://feeldreams.github.io/pics/awan/3.jpg" |
|
|
/> |
|
|
</div> |
|
|
<img |
|
|
id="stikersatu" |
|
|
class="stiker fade-in" |
|
|
src="https://feeldreams.github.io/bwa2.gif" |
|
|
/> |
|
|
<img id="stikerdua" src="https://feeldreams.github.io/weee.gif" /> |
|
|
<h3 id="teksnimasi"> |
|
|
babe, you look super cute.<br />can you send me a pic?<br />can |
|
|
I get a pic? |
|
|
</h3> |
|
|
<div id="Tombol"> |
|
|
<a id="By" onClick="fungsimau()">YES!!</a> |
|
|
<a id="Bn" onClick="fungsigamau()">NO!!</a> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
<section id="iniakhir"> |
|
|
<div class="wp" id="wpakhir"> |
|
|
<img src="https://feeldreams.github.io/pics/awan/6.jpg" /> |
|
|
</div> |
|
|
<img |
|
|
id="stikerakhir" |
|
|
class="stiker fade-in" |
|
|
src="https://feeldreams.github.io/cilukba.gif" |
|
|
/> |
|
|
<img |
|
|
id="stikerakhir2" |
|
|
style="display: none" |
|
|
src="https://feeldreams.github.io/emawh.gif" |
|
|
/> |
|
|
<h1 id="judulakhir"></h1> |
|
|
<p id="kalimatakhir"></p> |
|
|
<p id="palingakhir"></p> |
|
|
<div id="TombolWA"> |
|
|
<a onClick="menuju()">chat aku yaa babee</a> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
<div id="initom" class="menu"> |
|
|
<a class="tombol" onclick="tes()"> |
|
|
<svg |
|
|
xmlns="http://www.w3.org/2000/svg" |
|
|
width="16" |
|
|
height="16" |
|
|
fill="currentColor" |
|
|
class="bi bi-arrow-down" |
|
|
viewBox="0 0 16 16" |
|
|
> |
|
|
<path |
|
|
fill-rule="evenodd" |
|
|
d="M8 1a.5.5 0 0 1 .5.5v11.793l3.146-3.147a.5.5 0 0 1 .708.708l-4 4a.5.5 0 0 1-.708 0l-4-4a.5.5 0 0 1 .708-.708L7.5 13.293V1.5A.5.5 0 0 1 8 1z" |
|
|
/> |
|
|
</svg> |
|
|
</a> |
|
|
</div> |
|
|
|
|
|
<script> |
|
|
function hapus(){counter.style.display="none"} |
|
|
function keatas(){window.scrollTo(0, 0);} |
|
|
|
|
|
var date = new Date(); |
|
|
var days = ["Minggu", "Senin", "Selasa", "Rabu", "Kamis", "Jumat", "Sabtu"]; |
|
|
var months = ["Januari", "Februari", "Maret", "April", "Mei", "Juni", "Juli", "Agustus", "September", "Oktober", "November", "Desember"]; |
|
|
var hours = date.getHours(); |
|
|
var minutes = date.getMinutes(); |
|
|
|
|
|
|
|
|
if (hours < 10) {hours = "0" + hours;} |
|
|
if (minutes < 10) {minutes = "0" + minutes;} |
|
|
|
|
|
var day = days[date.getDay()]; |
|
|
var dateNum = date.getDate(); |
|
|
var month = months[date.getMonth()]; |
|
|
var year = date.getFullYear(); |
|
|
|
|
|
console.log(hours + "." + minutes + " WIB - " + day + ", " + dateNum + " " + month + " " + year); |
|
|
|
|
|
var element = document.querySelector("body");var watermark = document.createElement("div"); |
|
|
|
|
|
|
|
|
watermark.textContent = day + ", " + dateNum + " " + month + " " + year; |
|
|
watermark.style = "color:white;opacity:.5;font-size:10px;position:fixed;bottom:25px;left:25px;z-index:150"; |
|
|
element.appendChild(watermark); |
|
|
|
|
|
|
|
|
|
|
|
const body = document.querySelector("body"); audio = new Audio('' + linkmp3.src); function berjatuhan() {const heart = document.createElement("div"); heart.className = "fas fa-heart"; heart.style.left = (Math.random() * 90)+"vw"; heart.style.animationDuration = (Math.random()*3)+2+"s"; body.appendChild(heart);} setInterval(function name(params) {var heartArr = document.querySelectorAll(".fa-heart"); if (heartArr.length > 100) {heartArr[0].remove()}},100); |
|
|
|
|
|
initeksnimasisatu = teksnimasisatu.innerHTML;teksnimasisatu.innerHTML=""; |
|
|
function katateksnimasisatu(){ |
|
|
new TypeIt("#teksnimasisatu", { |
|
|
strings: ["" + initeksnimasisatu], startDelay: 50, speed: 50, cursor: true, |
|
|
afterComplete: function(){ |
|
|
teksnimasisatu.innerHTML = initeksnimasisatu; |
|
|
setTimeout(smn,200); |
|
|
},}).go(); |
|
|
} |
|
|
|
|
|
initeksnimasi = teksnimasi.innerHTML;teksnimasi.innerHTML=""; |
|
|
function katateksnimasi(){ |
|
|
new TypeIt("#teksnimasi", { |
|
|
strings: ["" + initeksnimasi], startDelay: 50, speed: 60, cursor: true, |
|
|
afterComplete: function(){ |
|
|
teksnimasi.innerHTML = initeksnimasi; |
|
|
setTimeout(muncultombol,200); |
|
|
},}).go(); |
|
|
} |
|
|
function gantistikerdua(){ |
|
|
stikersatu.style="opacity:0;transform:scale(0)"; |
|
|
setTimeout(gantifotostikerdua,300); |
|
|
} |
|
|
function gantifotostikerdua(){stikersatu.src=stikerdua.src;stikersatu.style="";} |
|
|
|
|
|
fungsi=0;fungsiklik=0;skrg=1; |
|
|
function tes(){ |
|
|
if(fungsi==0){ |
|
|
playaud(); |
|
|
initom.style="opacity:0;bottom:0;"; |
|
|
window.scrollBy({top: tinggi,behavior: 'smooth'}); |
|
|
fungsi = 1; |
|
|
skrg++; |
|
|
if(skrg==2){setTimeout(katateksnimasisatu,2300)}; |
|
|
if(skrg!=2 && skrg<4){setTimeout(smn,700);} |
|
|
if(skrg==4){setTimeout(katateksnimasi,500);setTimeout(gantistikerdua,2300);} |
|
|
} |
|
|
} |
|
|
function smn(){fungsi=0;initom.style="";} |
|
|
initom.style="opacity:0;bottom:0;transition:none"; |
|
|
|
|
|
function muncultombol(){fungtom=1;Tombol.style="opacity:1;transform:scale(1)";} |
|
|
function fungsimau(){ |
|
|
fungsi=0;tes(); |
|
|
teksjudulakhir = "mwehehehee thanksss babeeee >~<"; |
|
|
tekskalimatakhir = "hey babe, you know why<br>i wanna see your pic?<br><br><br>cause you're so super cute, pretty, and sweet."; |
|
|
tekspalingakhir = "love you more babe <3"; |
|
|
pesanwhatsapp = "waitt babee aku send pap nyaa"; |
|
|
} |
|
|
function fungsigamau(){ |
|
|
fungsi=0;tes(); |
|
|
teksjudulakhir = "babeee??? :("; |
|
|
tekskalimatakhir = "agak sedih sihh<br>gagal buat dapetin pap kamu :')"; |
|
|
tekspalingakhir = "but gapapa, walaupun gak dapet pap,<br>masih bisa liat kamu disekolah tiap hari :)"; |
|
|
pesanwhatsapp = "lain kali yaa babee aku send;" |
|
|
} |
|
|
|
|
|
function aksiakhir() { |
|
|
if(fungsiklik==0){ |
|
|
|
|
|
fungsiklik=1; |
|
|
setTimeout(katajudul,100) |
|
|
} |
|
|
} |
|
|
|
|
|
function katajudul(){ |
|
|
new TypeIt("#judulakhir", { |
|
|
strings: ["" + teksjudulakhir], startDelay: 50, speed: 50, cursor: true, |
|
|
afterComplete: function(){ |
|
|
judulakhir.innerHTML = teksjudulakhir; |
|
|
setTimeout(katakata,400); |
|
|
},}).go(); |
|
|
} |
|
|
function katakata(){ |
|
|
new TypeIt("#kalimatakhir", { |
|
|
strings: ["" + tekskalimatakhir], startDelay: 50, speed: 48, cursor: true, |
|
|
afterComplete: function(){ |
|
|
kalimatakhir.innerHTML = tekskalimatakhir; |
|
|
judulakhir.style="opacity:0;transform:scale(0);"; |
|
|
setTimeout(teksmuncul,350); |
|
|
setInterval(berjatuhan,200); |
|
|
setTimeout(kataakhir,1000); |
|
|
},}).go(); |
|
|
} |
|
|
function teksmuncul(){ |
|
|
judulakhir.innerHTML="I Love You"; |
|
|
judulakhir.style="font-family:var(--gaya-font3);font-size:27px"; |
|
|
|
|
|
stikerakhir.style="opacity:0;transform:scale(0)"; |
|
|
setTimeout(gantifotoakhir,300); |
|
|
} |
|
|
function jjteksnim(){judulakhir.style.animation="rto .8s infinite alternate";} |
|
|
function gantifotoakhir(){stikerakhir.src=stikerakhir2.src;stikerakhir.style="";} |
|
|
function kataakhir(){ |
|
|
new TypeIt("#palingakhir", { |
|
|
strings: ["" + tekspalingakhir], startDelay: 50, speed: 50, cursor: true, |
|
|
afterComplete: function(){ |
|
|
palingakhir.innerHTML = tekspalingakhir; |
|
|
setTimeout(muncultombol2,500); |
|
|
},}).go(); |
|
|
} |
|
|
function muncultombol2(){fungtom2=1;TombolWA.style="opacity:1;transform:scale(1)";} |
|
|
function menuju(){if(fungtom2==1){window.location = "https://api.whatsapp.com/send?phone=6289514509029&text=" + pesanwhatsapp;}} |
|
|
|
|
|
let tinggi = iniakhir.offsetHeight; |
|
|
console.log(tinggi); |
|
|
|
|
|
fungsiAud=0;function playaud(){if(fungsiAud==0){fungsiAud=1;audio.play();}} |
|
|
|
|
|
window.addEventListener("load", (event) => { |
|
|
window.scrollTo(0, 0); |
|
|
setTimeout(keatas,500); |
|
|
|
|
|
var overlay = document.querySelector(".overlay"); |
|
|
overlay.style.display = "none"; |
|
|
initom.style=""; |
|
|
first_stiker.style="opacity:1;transition:all 2s ease"; |
|
|
ScrollReveal({ reset: true }); |
|
|
ScrollReveal().reveal(".show-once", { reset: false}); |
|
|
ScrollReveal().reveal(".title", {duration: 2500,origin: "top",distance: "50px", easing: "cubic-bezier(0.5, 0, 0, 1)", rotate: { x: 20, z: -10 }}); |
|
|
ScrollReveal().reveal(".fade-in", {delay: 200, duration: 2500,move: 0}); |
|
|
ScrollReveal().reveal(".scaleUp", {duration: 2500, scale: 0.85}); |
|
|
ScrollReveal().reveal(".flip", {delay: 200, duration: 2000, rotate: { x: 20, z: 20}}); |
|
|
ScrollReveal().reveal(".slide-right", {duration: 1000,origin: "left",distance: "300px",easing: "ease-in-out"}); |
|
|
ScrollReveal().reveal(".slide-up", {duration: 1500, origin: "bottom", distance: "100px", easing: "cubic-bezier(.37,.01,.74,1)", opacity: 0, scale: 0.5}); |
|
|
|
|
|
document.addEventListener('scroll', function(e) { |
|
|
let documentHeight = document.body.scrollHeight; |
|
|
let currentScroll = window.scrollY + window.innerHeight; |
|
|
|
|
|
let modifier = 200; |
|
|
if(currentScroll + modifier > documentHeight) { |
|
|
console.log('Sudah sampai bawah!'); |
|
|
initom.style="opacity:0;bottom:0"; |
|
|
setTimeout(aksiakhir,10); |
|
|
} else { |
|
|
|
|
|
} |
|
|
}) |
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
function setCookie(name, value, days) { |
|
|
var expires = ""; |
|
|
if (days) { |
|
|
var date = new Date(); |
|
|
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); |
|
|
expires = "; expires=" + date.toUTCString(); |
|
|
} |
|
|
document.cookie = name + "=" + (value || "") + expires + "; path=/"; |
|
|
} |
|
|
|
|
|
function getCookie(name) { |
|
|
var nameEQ = name + "="; |
|
|
var ca = document.cookie.split(';'); |
|
|
for (var i = 0; i < ca.length; i++) { |
|
|
var c = ca[i]; |
|
|
while (c.charAt(0) == ' ') c = c.substring(1, c.length); |
|
|
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length); |
|
|
} |
|
|
return null; |
|
|
} |
|
|
</script> |
|
|
</body> |
|
|
</html> |
|
|
|
