- Katılım
- 21 Haz 2018
- Konular
- 138
- Mesajlar
- 633
- Çözümler
- 1
- Tepkime puanı
- 271
- Puanları
- 2,264
- Konum
- İstanbul
- Adım
- Çağatay
- Meslek
- Şöför
- Cihaz
- iPhone 8 Plus
Web sitenizi yayına kadari süreçte ziyaretçilerinize gösterebileceğiniz basit ama hoş görünümlü, animasyonlu "Hazırlanıyor..." safyası isterseniz aşağıdaki kodları kullanababilirsiniz.
Renkleri değiştirerek daha hoş görüntüler elde edebilirsiniz.
Renkleri değiştirerek daha hoş görüntüler elde edebilirsiniz.
HTML:
<!DOCTYPE html>
<html lang="tr">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Hazırlanıyor...</title>
<link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@600&display=swap" rel="stylesheet">
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
height: 100vh;
background: linear-gradient(270deg, #1f1c2c, #928dab);
background-size: 400% 400%;
animation: gradientBG 10s ease infinite;
display: flex;
justify-content: center;
align-items: center;
font-family: 'Orbitron', sans-serif;
overflow: hidden;
}
h1 {
color: #fff;
font-size: 3em;
text-align: center;
position: relative;
animation: glow 2s ease-in-out infinite alternate;
}
@keyframes gradientBG {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
@keyframes glow {
0% {
text-shadow: 0 0 5px #fff, 0 0 10px #00e0ff, 0 0 20px #00e0ff;
}
100% {
text-shadow: 0 0 20px #fff, 0 0 30px #00e0ff, 0 0 40px #00e0ff;
}
}
</style>
</head>
<body>
<h1>🚧 Hazırlanıyor... 🚧</h1>
</body>
</html>