-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
497 lines (461 loc) · 21.6 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
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
<!DOCTYPE HTML>
<html>
<head>
<title>Semarang Tourism</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="extension/themes/6/js-image-slider.css" rel="stylesheet" type="text/css" />
<script src="extension/themes/6/mcVideoPlugin.js" type="text/javascript"></script>
<script src="extension/themes/6/js-image-slider.js" type="text/javascript"></script>
<link href="extension/generic.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="js/jquery.scrollTo-1.4.3.1-min.js"></script>
<script type="text/javascript" src="js/waypoints.min.js"></script>
<script type="text/javascript" src="js/jquery.colorbox-min.js"></script>
<link type="text/css" rel="stylesheet" href="css/reset.css">
<link type="text/css" rel="stylesheet" href="css/style.css">
<link type="text/css" rel="stylesheet" href="css/colorbox.css">
<script type="text/javascript">
$(document).ready(function(){
$(function() {
var sections = $("section");
var navigation_links = $("nav a.nav-item");
sections.waypoint({
handler: function(direction) {
var active_section;
active_section = $(this);
if (direction === "up") active_section = active_section.prev();
var active_link = $('nav a[href="#' + active_section.attr("id") + '"]');
navigation_links.removeClass("selected");
active_link.addClass("selected");
}
})
navigation_links.click( function(event) {
event.preventDefault();
$.scrollTo($(this).attr("href"),{duration: 2000});
});
});
$('.list-link').colorbox({opacity:0.5});
$('.list-link').hover(function(){
$(this).siblings('.list-caption').slideDown(100);
$(this).siblings('.list-img').removeClass('grayscale');
},function(){
$(this).siblings('.list-caption').slideUp(100);
$(this).siblings('.list-img').addClass('grayscale');
});
});
</script>
<link rel="stylesheet" href="extension/jquery.fancybox.css" type="text/css" media="screen" />
<script type="text/javascript" src="extension/jquery.fancybox.pack.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('.view').fancybox({
'padding' : 0,
'overlayColor' : '#000000',
'openEffect' : 'fade',
'closeEffect' : 'fade',
'scrolling' : 'no',
'closeBtn': true,
'closeClick': false,
'width' : 400,
'height' : 400,
'minWidth' : 400,
'minHeight' : 400,
'type' : 'iframe',
'autoScale' : false
});
});
</script>
<script
src="http://maps.googleapis.com/maps/api/js?key=AIzaSyCb3S6YrrX9IEsidqfdJDNzT068-s7MOaw&sensor=false">
</script>
<script>
var myCenter=new google.maps.LatLng(-6.981965,110.4119);
function initialize()
{
var mapProp = {
center:myCenter,
zoom:10,
mapTypeId:google.maps.MapTypeId.HYBRID
};
var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);
var marker=new google.maps.Marker({
position:myCenter,
});
marker.setMap(map);
var infowindow = new google.maps.InfoWindow({
content:"Kota Semarang"
});
infowindow.open(map,marker);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
<link rel="stylesheet" href="js/slide.css">
<script src="js/fancy-hover.js"></script>
<script src="js/modernizr-2.6.2.min.js"></script>
<script src="js/jquery-ui.min.js"></script>
<script>
Modernizr.load({
test: Modernizr.canvas && !Modernizr.touch,
yep: 'js/fancy-hover.js',
complete: function () { fancyHover.init($('ul#employeeList')); }
});
</script>
<style>
/*figcaption is hidden by default to avoid flash of unstyled content, so we adjust to show by default in the following cases */
.no-canvas ul#employeeList li figcaption { bottom:0 !important; }
.touch ul#employeeList li figcaption { bottom:0 !important; }
</style>
<script type="text/javascript" src="extension/jquery.bxslider.js"></script>
<script src="js/extension.bxslider.min.js"></script>
<link rel="stylesheet" href="extension/jquery.bxslider.css">
<script type="text/javascript">
$(document).ready(function(){
$('.slider1').bxSlider({
slideWidth: 300,
minSlides: 4,
maxSlides: 5,
slideMargin: 10
});
});
</script>
</head>
<body>
<header>
<div class="container">
<a href="index.php" class="logo-small" title=""></a>
<div class="nav-container right">
<nav >
<a class="nav-item" href="#home" title="Home">Home</a>
<a class="nav-item" href="#history" title="Sejarah">Sejarah</a>
<a class="nav-item" href="#jalanjalan" title="Jalan-Jalan">Jalan-Jalan</a>
<a class="nav-item" href="#akses" title="Akses">Akses</a>
<a class="nav-item" href="#contact" title="Kontak">Kontak Kami</a>
</nav>
</div>
<div class="clear"></div>
</div>
</header>
<article>
<section id="home">
<div class="container">
<div id="sliderFrame">
<div id="slider">
<img src="extension/images/slider-1.jpg" alt="Lawang Sewu, Daerah Tugu Muda, Kota Semarang." />
<a class="video" href="http://www.youtube.com/watch?v=kin7yb-Y_NY">
<img src="extension/images/slider-2.jpg" alt="Klenteng Sam-po-kong, Sampangan, Kota Semarang." />
</a>
<a class="video" href="http://www.youtube.com/watch?v=kin7yb-Y_NY">
<img src="extension/images/slider-3.jpg" alt="Daerah Pecinan, Kampung Semawis, Kota Semarang."/>
</a>
<a class="video" href="http://www.youtube.com/watch?v=kin7yb-Y_NY">
<img src="extension/images/slider-4.jpg" alt="Pagoda AVALOKITESVARA, Buddhagaya Watugong, Kota Semarang."/>
</a>
<a class="video" href="http://www.youtube.com/watch?v=kin7yb-Y_NY">
<img src="extension/images/slider-5.jpg" alt="Masjid Agung Jawa Tengah, Kota Semarang."/>
</a>
</div>
</div>
</div>
</section>
<section id="home_dua">
<div class="container">
<div class="home_text"><p><b>Motto : </b>"Semarang Kota ATLAS" (Aman, Tertib, Lancar, Asri dan Sehat).<br/>
Kota <b>Lumpia :</b> Lumpia adalah makanan khas Semarang, akulturasi 2 budaya yaitu budaya Jawa dan China.<br/>
<b>The Port of Java : </b>pencitraan kota Semarang sebagai pusat Pelabuhan Jawa.<br/>
<b>Hari jadi :</b> 2 Mei 1547<br/>
<b>Situs Resmi Pemerintah Semarang :</b> <a href="http://www.semarang.go.id">http://www.semarang.go.id</a><br/>
</p></div>
</div>
</section>
<section id="history">
<div class="container">
<div class="clear"></div>
<div class="title">
<h3><b>Sejarah Kota Semarangan</b></h3>
</div>
<div class="history1">
<span class="image-1"><img src="img/history1.png"> </span>
<span class="s1">
<h3>Awal Mula Semarang</h3>
<p><br/>Sejarah Semarang berawal kurang lebih pada abad ke-8 M, yaitu daerah pesisir yang bernama Pragota (sekarang menjadi Bergota) dan merupakan bagian dari kerajaan Mataram Kuno. Daerah tersebut pada masa itu merupakan pelabuhan dan di depannya terdapat gugusan pulau-pulau kecil.<br/><br/>Akibat pengendapan, yang hingga sekarang masih terus berlangsung, gugusan tersebut sekarang menyatu membentuk daratan. Bagian kota Semarang Bawah yang dikenal sekarang ini dengan demikian dahulu merupakan laut. Pelabuhan tersebut diperkirakan berada di daerah Pasar Bulu sekarang dan memanjang masuk ke Pelabuhan Simongan, tempat armada Laksamana Cheng Ho bersandar pada tahun 1405 M.<br/><br/>Di tempat pendaratannya, Laksamana Cheng Ho mendirikan kelenteng dan mesjid yang sampai sekarang masih dikunjungi dan disebut Kelenteng <b>Sam Po Kong (Gedung Batu)</b>.
</p>
</span>
</div>
<div class="history2">
<span class="image-2"><img src="img/history2.png"> </span>
<span class="s1">
<h3><b>Akhir Abad ke 15 M</b></h3>
<p><br/>Pada akhir abad ke-15 M ada seseorang ditempatkan oleh Kerajaan Demak, dikenal sebagai Pangeran Made Pandan (Sunan Pandanaran I), untuk menyebarkan agama Islam dari perbukitan Pragota. Dari waktu ke waktu daerah itu semakin subur, dari sela-sela kesuburan itu muncullah pohon asam yang arang (bahasa Jawa: Asem Arang), sehingga memberikan gelar atau nama daerah itu menjadi <b>"Semarang"</b>.<br/><br/>
Sebagai pendiri desa, kemudian menjadi kepala daerah setempat, dengan gelar Kyai Ageng Pandan Arang I. Sepeninggalnya, pimpinan daerah dipegang oleh putranya yang bergelar Pandan Arang II.<br/><br/>Di bawah pimpinan Pandan Arang II, daerah Semarang semakin menunjukkan pertumbuhannya yang meningkat, sehingga menarik perhatian Sultan Hadiwijaya dari Pajang. Karena persyaratan peningkatan daerah dapat dipenuhi, maka diputuskan untuk menjadikan Semarang setingkat dengan Kabupaten.<br/><br/>Pada tanggal 2 Mei 1547 bertepatan dengan peringatan maulid Nabi Muhammad SAW, tanggal 12 rabiul awal tahun 954 H disahkan oleh Sultan Hadiwijaya setelah berkonsultasi dengan Sunan Kalijaga. Tanggal 2 Mei kemudian ditetapkan sebagai hari jadi kota Semarang.
</p>
</span>
</div>
</section>
<section id="jalanjalan">
<div class="container">
<div class="title">
<h1>Jalan-Jalan di Semarang Yuk !</h1>
</div>
<div class="about_text1"><p>Apa yang bisa Anda lihat di Semarang?</p></div>
<div class="about_text2">
<p>Semarang memang identik dengan Lawang Sewu, namun sebenarnya masih banyak tempat wisata lain yang tidak kalah menarik dari gedung bekas kantor kereta api peninggalan kolonialisme Belanda tersebut. Namun, selain itu masih tempat-tempat bersejarah yang layak jadi tujuan wisata di kota yang pernah dijuluki sebagai “Venice van Java” ini. seperti : Gereja Blendug, Pantai Marina, Pantai Maron, Kuil Sam Poo Kong, Vihara Buddhagaya Watugong, dan maih banyak lagi</p>
</div>
<div class="content11 left">
<div class="desc2">
<ul id="employeeList">
<li>
<a class="fancybox fancybox.iframe" href="pages/lawangsewu.html">
<figure>
<img src="img/Wisata/lawangsewu.jpg" width="300" height="211"/>
<figcaption>
<br/>
<h2>Lawang Sewu</h2>
<h3>Lawang Sewu merupakan sebuah bangunan kuno peninggalan jaman belanda yang dibangun pada 1904. Semula gedung ini untuk kantor pusat perusahaan kereta api (trem) penjajah Belanda atau Nederlandsch Indishe Spoorweg Naatschappij (NIS).</h3>
</figcaption>
</figure>
</li>
</ul>
</a>
</div>
</div>
<div class="content11 left">
<div class="desc2">
<ul id="employeeList">
<li>
<a class="fancybox fancybox.iframe" href="pages/masjid.html">
<figure>
<img src="img/Wisata/masjidagung.jpg" width="300" height="211"/>
<figcaption>
<br/><br/>
<h2>Masjid Agung Jateng</h2>
<h3>Masjid Agung Jawa Tengah adalah Masjid yang terletak di jalan Gajah Raya, bergaya arsitektur perpaduan antara Jawa, Jawa Tengah dan Yunani.</h3>
</figcaption>
</figure>
</li>
</ul>
</a>
</div>
</div>
<div class="content11 left">
<div class="desc2">
<ul id="employeeList">
<li>
<a class="fancybox fancybox.iframe" href="pages/sampokong.html">
<figure>
<img src="img/Wisata/sampokong.jpg" width="300" height="211"/>
<figcaption>
<br/><br/>
<h2>Klenteng Sampokong</h2>
<h3>Kelenteng Sam Po Kong merupakan bekas tempat persinggahan dan pendaratan pertama seorang Laksamana Tiongkok beragama Islam yang bernama Zheng He / Cheng Ho.</h3>
</figcaption>
</figure>
</li>
</ul>
</a>
</div>
</div>
<div class="content11 left">
<div class="desc2">
<ul id="employeeList">
<li>
<a class="fancybox fancybox.iframe" href="pages/semawis.html">
<figure>
<img src="img/Wisata/semawis.jpg" width="300" height="211"/>
<figcaption>
<br/><br/>
<h2>Kampoeng Semawis</h2>
<h3>Pasar Semawis merupakan sebuah even yang pada mulanya digelar pada saat menjelang perayaan Imlek. Atas prakarsa komunitas Pecinan Semarang untuk pariwisata.</h3>
</figcaption>
</figure>
</li>
</ul>
</a>
</div>
</div>
<div class="content11 left">
<div class="desc2">
<ul id="employeeList">
<li>
<a class="fancybox fancybox.iframe" href="pages/watugong.html">
<figure>
<img src="img/Wisata/watugong.jpg" width="300" height="211"/>
<figcaption>
<br/>
<h2>Vihara Watugong</h2>
<h3>Vihara Buddhagaya Watugong adalah sebuah Vihara yang diresmikan pada 2006 lalu dan dinyatakan MURI sebagai pagoda tertinggi di Indonesia. Vihara Buddhagaya Watugong terletak 45 menit dari pusat Kota Semarang.</h3>
</figcaption>
</figure>
</li>
</ul>
</a>
</div>
</div>
<div class="clear"></div>
<br/>
<div class="about_text1"><p>Bagaimana dengan Kulinernya?</p></div>
<div class="about_text2">
<p>Salah satu kota wisata di Indonesia yang layak dikunjungi pada saat liburan adalah ibu kota propinsi Jawa Tengah, yaitu kota Semarang. Tak hanya soal destinasi wisata, Semarang juga punya ragam kuliner yang menggugah selera. Selain bandeng presto, dan lumpia yang jadi makanan khas dari kota ini, berikut macam – macam kuliner paling enak dan patut di coba bila kita berlibur ke Semarang. Selain Bandung dan Yogya, Semarang juga merupakan surganya kuliner. Berbagai macam jajanan dan makanan khas, wajib brosis cicipi saat traveling ke ibukota Provinsi Jawa Tengah tersebut. Soal rasa tidak kalah dengan kuliner dari daerah lain. </p>
</div>
<div class="content11 left">
<div class="desc2">
<ul id="employeeList">
<li>
<a class="fancybox fancybox.iframe" href="#">
<figure>
<img src="img/Kuliner/lumpia.jpg" width="300" height="211"/>
<figcaption>
<br/>
<h2>Lumpia Semarang</h2>
<h3>Cita rasa lumpia semarang adalah perpaduan rasa antara Tionghoa dan Indonesia karena pertama kali dibuat oleh seorang keturunan Tionghoa yang menikah dengan orang Indonesia dan menetap di Semarang, Jawa Tengah.</h3>
</figcaption>
</figure>
</li>
</ul>
</a>
</div>
</div>
<div class="content11 left">
<div class="desc2">
<ul id="employeeList">
<li>
<a class="fancybox fancybox.iframe" href="#">
<figure>
<img src="img/Kuliner/soto.jpg" width="300" height="211"/>
<figcaption>
<br/>
<h2>Soto Bangkong</h2>
<h3>Berkunjung ke Semarang jika tidak mampir diwarung Soto Bangkong terasa ada yang kurang. Soto Bangkong memiliki khas rasa yang sudah melegenda, semangkuk soto dengan aneka jenis aneka sate dan lauk lainnya membuat kita ketagihan.</h3>
</figcaption>
</figure>
</li>
</ul>
</a>
</div>
</div>
<div class="content11 left">
<div class="desc2">
<ul id="employeeList">
<li>
<a class="fancybox fancybox.iframe" href="#">
<figure>
<img src="img/Kuliner/bandeng.jpg" width="300" height="211"/>
<figcaption>
<br/>
<h2>Bandeng Elrina</h2>
<h3>Bandeng Juwana adalah sebuah pusat oleh-oleh di Semarang yang tidak hanya menyediakan oleh-oleh khas semarang saja yaitu Bandeng Duri Lunak, tetapi juga menyediakan aneka macam oleh-oleh khas Jawa Tengah.</h3>
</figcaption>
</figure>
</li>
</ul>
</a>
</div>
</div>
<div class="clear"></div>
<div class="clear"></div>
</div>
<div class="clear"></div>
</div>
</section>
<section id="akses">
<div class="container">
<div class="title">
<h1>Yuuuk, Menuju Jawa Tengah !</h1>
</div>
<div class="kesemarang1">
<span class="image-1"><img src="img/kapal.png"> </span>
<span class="s1">
<h3>Melalui Laut</h3>
<p><br/><b>Pelabuhan Tanjung Emas Semarang</b><br/>Beberapa kapal milik negara yang dikelola oleh perusahaan PT. PELNI melayani pelayaran regular antara Semarang dan sebagian kota besar di nusantara, seperti Jakarta, Surabaya, Padang, Medan (Pulau Sumatra), Banjarmasin (Pulau Kalimantan), Makasar (Pulau Sulawesi), Gorontalo, Manokwari , Jayapura ( pulau Papua ) , Bali, Lombok, dll.
</p>
</span>
</div>
<br/>
<div class="kesemarang2">
<span class="image-1"><img src="img/train.png"> </span>
<span class="s1">
<h3>Melalui Darat</h3>
<p><br/>Terdapat dua jalan utama penghubung propinsi Jawa Tengah dengan empat propinsi lainnya (Jawa Barat, Jakarta, Yogyakarta, dan Jawa Timur) yaitu jalur utara dan jalur selatan.<br/><br/><b>PT. KERETA API INDONESIA (KAI)</b><br/>Reservasi :<br/><b>Stasiun Kereta Api Tawang:</b><br/>ph : +62 24 355 2093<br/>ph2 : +62 24 358 2859.
</p>
</span>
</div>
<div class="kesemarang3">
<span class="image-1"><img src="img/kapalmabur.png"> </span>
<span class="s1">
<h3>Melalui Udara</h3>
<p><br/><b>Bandara Achmad Yani Semarang</b><br/>Provinsi Jawa Tengah memiliki dua bandara besar yang menghubungkan sebagian besar kota-kota besar di nusantara baik penerbangan langsung maupun tidak langsung. Salah satunya adalah Achmad Yani Airport, Semarang.<br/><br/><b>Kantor Penerbangan Jawa Tengah<br/>Kota Semarang</b><br/><br/><b>Garuda Indonesia Airlines</b><br/>Jl. Brigjend Slamet Riyadi 201 (Cakra Hotel)<br/>ph : +62 271 630028<br/>Jl. Pandanaran 116-120 (Graha Santika Hotel)<br/>ph : +62 24 8449331<br/>
</p>
</span>
</div>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
</div>
</section>
<section id="kontak">
<div class="container">
<div class="title">
<h1>Kontak Kami aja</h1>
</div>
<div class="contentgooglemap">
<div id="googleMap" style="width:1000px;height:400px;"></div>
</div>
<div class="contentkontak left">
<div class="titlecontact">
<h1>Semarang Centre </h1>
<h1>Pemuda</h1>
</div>
<div class="deschitam">
<p><b>Jl. Pemuda 147, Semarang.</b></p><br/>
<p><b>Contact Person : Kartika Koemalasari S, S.S., M.M. </b></p>
<br />
<p>Ph/Fax : +62 24 3515451</p><br/>
<p>Mobile : 081 5753 28835</p><br/>
<p>Email : <a href="mailto:kartikakoemalasari@yahoo.com" style="color:#0d79c0;">kartikakoemalasari@yahoo.com</a></p>
</div>
</div>
<div class="contentkontak right">
<form action="pages/submit.php" method="post">
<div class="input-label">
<label for="name">NAMA</label>
</div>
<div class="input-text">
<input id="name" name="name" type="text" placeholder="Nama" value="" required/>
</div>
<div class="input-label">
<label for="phone">KONTAK</label>
</div>
<div class="input-text">
<input id="phone" name="phone" type="text" placeholder="No.Telp" value="" required/>
</div>
<div class="input-label">
<label for="email">EMAIL</label>
</div>
<div class="input-text">
<input id="email" name="email" type="text" placeholder="Email" value="" required/>
</div>
<div class="input-label">
<label for="message">PESAN ANDA</label>
</div>
<div class="input-text">
<textarea id="message" name="message" placeholder="Pesan Anda" required></textarea>
</div>
<div class="input-submit">
<input id="submit" type="image" alt="submit" src="img/button.png" onclick="reminder()"/>
</div>
</form>
</div>
<div class="clear"></div>
</div>
</section>
<section id="foot2">
<div class="container">
<div class="contentkontak left">
<div class="descputih">
<p>Copyright © 2013 DINHUBKOMINFO - Pemerintah Prov. Jawa Tengah. All rights reserved.</p>
</div>
</div>
</div>
</section>
</body>
</html>