-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
158 lines (157 loc) · 5.98 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
<!DOCTYPE html>
<html lang="en">
<head>
<script src="qrc:///js/jquery.js"></script>
<link href="css/revamp.css" rel="stylesheet">
</head>
<body page="1">
<input type="submit" value="×" class="exit" onClick="ign.quit()">
<div class="devbuild">DEVELOPER PRIKITIW</div>
<div id="page1" class="container">
<h1>Halo :-)</h1>
<div class="colored"></div>
<h2>Selamat datang di IGOS Nusantara. Kami akan memandu Anda untuk mulai berkenalan dengan
fitur-fitur yang tersedia di sistem operasi ini.</h2>
<h2>Klik <b>Mulai</b> untuk memulai tur.</h2>
<input id="btn-page1" class="button button-next" type="submit" value="Mulai">
</div>
<div id="page2" class="container">
<h1>Ikhtisar</h1>
<div class="colored"></div>
<img style="display: block; width: 25%; float: left; margin: 10% 12.5% 10% 12.5%;" src="img/igos-nusantara-logo.png" />
<div class="description-right">
<h2>IGOS Nusantara disingkat IGN adalah sistem operasi open source
yang memakai kernel Linux.
IGN mulai dikembangkan tahun 2006 ditandai
dengan peluncuran IGN2006. Setiap tahun IGN secara teratur diluncurkan.</h2>
<h2>IGN 100% gratis untuk Anda nikmati dan bagikan.</h2>
</div>
<input id="btn-page2" class="button button-next" type="submit" value="Lanjut">
<input class="button button-back" id="page1" type="submit" value="Kembali">
</div>
<div id="page3" class="container">
<h1>Keunggulan IGN</h1>
<div class="colored"></div>
<div class="description-left">
<h2>Beberapa alasan mengapa harus memakai IGOS Nusantara adalah :
<li>100% free dan opensource</li>
<li>Ribuan aplikasi gratis</li>
<li>Bebas Virus dan Spyware</li>
<li>OS yang luar biasa powerfull</li></h2>
</div>
<input id="btn-page3" style="float: right;" class="button button-next" type="submit" value="Lanjut">
<input class="button button-back" id="page2" type="submit" value="Kembali">
</div>
<div id="page4" class="container">
<h1>Kolaborasi</h1>
<div class="colored"></div>
<div class="description-right">
<h1 class="sub">Klik. Terhubung.</h1>
<h2>Beberapa fasilitas pendukung dalam berbagi di IGN:
<li>Surel Evolution, Kalender dan lainnya</li>
<li>Empathy Chat Video dan Teks</li>
<li>Berbagi Berkas Pribadi</li>
<li>Gwibber Tweets dan Dents</li>
<li>Remote Desktop</li></h2>
</div>
<img src="img/kolaborasi.png" style="width: 45%; margin: 5% 55% 0 0;">
<input id="btn-page4" class="button button-next" type="submit" value="Lanjut">
<input class="button button-back" id="page3" type="submit" value="Kembali">
</div>
<div id="page5" class="container">
<h1>Hiburan dan Media</h1>
<div class="colored"></div>
<div class="description-right">
<h1 class="sub">Mainkan Semuanya.</h1>
<h2>Dalam bidang hiburan dan media, IGN menyediakan:
<li>Pemutar Video Totem</li>
<li>Pemutar Musik dan Podcast Rhythmbox</li>
<li>Perekam Suara</li>
<li>Pengekstrak CD Sound Juicer</li>
<li>Pembuat CD/DVD</li>
<li>Stan Foto Cheese</li>
<li>Pengatur Foto Shotwell</li></h2>
</div>
<img src="img/media.png" style="width: 45%; margin: 5% 55% 0 0;">
<input id="btn-page5" class="button button-next" type="submit" value="Lanjut">
<input class="button button-back" id="page4" type="submit" value="Kembali">
</div>
<div id="page6" class="container">
<h1>Kreativitas</h1>
<div class="colored"></div>
<div class="description-left">
<h2>IGN Menyediakan untuk mengakomodasi bakat anda :
<li>Penyunting Gambar Gimp</li>
<li>Penyunting Grafis Vektor Inkscape</li>
<li>Scribus</li>
<li>Simple Scan</li>
<li>Blender 3D Studio</li>
<li>Buku Sketsa Digital MyPaint</li>
<li>Penyunting Video PiTiVi</li>
<li>Penyunting Suara Audacity</li>
</h2>
</div>
<img src="img/grafis.png" style="width: 45%; margin: 5% 0 0 55%;">
<input id="btn-page6" class="button button-next" type="submit" value="Lanjut">
<input class="button button-back" id="page5" type="submit" value="Kembali">
</div>
<div id="page7" class="container">
<h1>Perkantoran</h1>
<div class="colored"></div>
<div class="description-right">
<h1 class="sub">Office. Redesigned.<h1>
<h2>Tetap produktif dengan aplikasi khas perkantoran yang didesain ulang oleh IGN.
<li>Pelacak Waktu Hamster</li>
<li>Penyimpan Catatan Gnote</li>
<li>LibreOffice Writer</li>
<li>LibreOffice Impress</li>
<li>LibreOffice Calc</li>
<li>Pengenal Teks GScan2PDF</li>
<li>Pembuat Peta-Pikiran Vym</li>
</h2>
</div>
<img src="img/perkantoran.png" style="width: 45%; margin: 5% 55% 0 0;">
<input id="btn-page7" class="button button-next" type="submit" value="Lanjut">
<input class="button button-back" id="page6" type="submit" value="Kembali">
</div>
<div id="page8" class="container">
<h1 style="text-align: center; margin-top: 20%;">Terima kasih</h1>
<input class="button button-back" id="page7" type="submit" value="Kembali">
</div>
<script>
$(".button-next").click(function() {
var next = $(this).attr("id").replace("btn-","");
function nextpage() {}
$("#"+next).fadeOut(1000, nextpage);
var pg = parseInt($('body').attr('page'))+1;
$('body').attr('page',pg);
});
$(".button-back").click(function(){
var back_page = $(this).attr('id');
function back(){};
$("#"+back_page).fadeIn(1000,back());
var pg = parseInt($('body').attr('page')) - 1;
$('body').attr('page',pg)
});
$(window).bind('keydown',function(e){
var page = $('body').attr('page');
if(e.keyCode == 39){
var next = parseInt(page);
function nextpage(){};
if(next < 8){
$("#page"+next).fadeOut(1000,nextpage());
$('body').attr('page',next + 1);
}
}
else if(e.keyCode == 37){
var back = parseInt(page) - 1;
function back(){};
if(page > 1){
$("#page"+back).fadeIn(1000);
$('body').attr('page',back);
}
}
});
</script>
</body>
</html>