Cara Mudah Membuat Timeout SplashScreen dengan JavaScript

Selasa, 1 Sep 2020

Beberapa hari yang lalu saat tahap pertama game yang saya buat hampir jadi, saya ingin menambahkan splashscreen pada game. Sebenarnya splash screen di game sudah saya buat dengan menggunakan phaser.js. SplashScreen yang sudah ada tersebut bekerja sebagai loader ketika game sedang meload komponen-komponen game, seperti gambar, animasi dan suara.

Splashscreen yang ingin saya buat adalah untuk menampilkan logo saya sendiri, sebagai developer. Sebagaimana kita ketahui, Kerja splashScreen adalah menampilkan tampilan informasi dengan jangka waktu tertentu dia akan menutup sendiri. Dengan begitu pengguna game atau aplikasi akan mengetahui informasi dengan tampilan sekilas yang dirasa tidak mengganggu.

cara membuat timeout splashscreen javascript

Cara Mudah Membuat TimeOut Splash Screen dengan Javascript

Untuk membuat splashScreen cara yang saya lakukan sangat sederhana. Saya tidak menggunakan library JavaScript macam-macam,Tapi agar lebih simple contoh disini saya menggunakan library jQuery. tetapi hanya memanfaatkan fungsi bawaan JavaScript yaitu setTimeout(). 

langsung saja begini contohnya:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
<html>
<head>
<link rel="stylesheet" href="gaya.css">
</head>
<body>
<div id="loader">
	<div id="logo"><img src="logo.png"></div>
</div>
<script type="text/javascript" src="jquery.js"></script>
<script>            
     $(document).ready(function() {                
		setTimeout(function(){$("#loader").remove();}, 1000);
     });
</script> 
</div>
</body>
</html>

Informasi:
Inti dari skrip splashscreen diatas adalah pada fungsi setTimeout() yang akan bekerja setelah waktu mencapai 1000 ms atau satu detik. Dimana fungsi yang bekerja adalah menghapus (remove)  elemen id=loader. 

Bila anda ingin memperpanjang waktu tampil splashscreen anda, silahkan ubah bagian waktu 1000 menjadi angka sesuai kebutuhan anda. Demikian tulisan kali ini, semoga bermanfaat.
logoblog

Tidak ada komentar:

Posting Komentar