Javascript Pendahuluan

Wah ga terasa nih KP sudah hampir seminggu lebih berjalan, dan ada waktu luang sedikit nih di sela-sela pengerjaan proyek yang bertumpuk dari RDTR kota cigudeg hingga Revisi RTRW kabupaten bengkalis. Disela waktu ini Saya mencoba menyempatkan diri dan menyalurkan hobi saya dalam dunia web dan sekaligus untuk berbagi ilmu kepada teman-teman semua mengenai salah satu teknologi web yaitu javascript. Mungkin sebagian dari kita semua udah pada tau apa itu javascript. Java script tidak sama dengan bahasa pemrograman java walaupun dikembangkan dari bahasa ini oleh sun microsystem dan Netscape communication. Java script sendiri muncul akibat para pengembang web menginginkan kontens yang lebih dinamis dan interaktif dari web yang bukan sekedar teks atau gambar belaka. Pada awal perkembangannya maksud ini di akomodasi oleh munculnya CGI (common gateway interface). Dengan teknologi ini developer web dapat membuat pencacah pengunjung atau site tracker, animasi sederhana dan lainnya. Namun salah satu kelemahan CGI adalah beban pemrosesan di letakkan di server atau yang disebut dengan  server side scripting sehingga bila trafik pengunjung lagi banyak, maka server bisa kewalahan dalam mengatasi sibuknya lalu lintas dan bisa-bisa server down. Nah, makanya salah satu alternative nya adalah mengurangi beban server dengan meletakkan script pada client (client side scripting). Maka atas dasar ini neetscape dan sun microsystem mengembangkan javascript khusus untuk dipakai browser netscape navigator, Microsoft juga telah mengembangkan script yang sama yaitu VBscript khusus untuk browser kondang mereka yaitu internet explorer.

Perbedaan  utama javascript dengan java adalah, java adalah bahasa pemrograman tingkat tinggi yang berbasis compiler sedangkan javscript berbasis interpreter yaitu browser internet. Hal ini sama dengan bahasa pemrograman python yang juga berbasis interpreter. Mungkin anda masih bertanya apa sih sebenarnya contoh real javascript dan bagaimana ia di integrasikan lewat HTML dan teknoogi web lainnya? . sebenarnya javascript embedded dengan HTML dan contoh nyata nya adalah pada saat anda mungkin menggunakan facebook anda biasa menggunakan form untuk login, untuk mengecek benar tidaknya password yang anda masukkan biasanya di gunakan javascript atau pada saat anda menggunakan tab untuk berpindah dari satu halaman ke halaman lainnya, contoh lainnya adalah anda mengepost komen, megikuti kuis dan sebagainya. Awalnya javascript hanya compatible  dengan netscape navigator namun dikemudian hari microsoft internet explorer pun dapat menggunakannnya.

Mungkin ada yang bertanya lagi apa perbedaannya javascript dengan jscript? Simple saja jawabanya jscript adalah javascript yang dikeluarkan versi microsoft si raja software untuk browser andalan mereka yaitu IE (internet explorer) dan teknologi server side scripting ASP.net. Siapa yang mengembangkan dan menstandardisasi javascript ?. awalnya pengembangan utama berada pada tangan netscape communicator namun pada tahun 1996 netscape menyerahkan proses standardisasi kepada ECMA (European computer manufacturers association) http://www.ecma.ch. Mungkin anda bertanya lagi kalo untuk belajar javascript apakah saya harus tau bahasa pemrograman? Jawabannya adalah tidak, namun lebih baik jika anda pernah mempelajari bahasa pemrograman seperti C++,C ,VB, java dan lain-lain, karena secara umum konsepnya tidak jauh berbeda. Yang anda perlukan hanyalah kemauan untuk belajar dan computer yang dilengkapi dengan text editor atau IDE web development seperti dreamweaver atau visual web developer dan browser tentunya dan saya sarankan untuk memakai lebih dari satu browser setidaknya yang paling populer seperti IE dan Mozilla firefox.

Langsung ke intinya

Buka browser notepad anda atau jalankan dreamweaver atau program lainnya dan cobalah code berikut ini.(untuk ini saya menggunakan program notepad++yang bisa anda download di internet) dan saya asumsi anda setidaknya telah mengenal HTML basic.\

Setelah itu simpan dengan nama belajar_javascript.html dan coba jalankan dengan browser dengan cara jika anda menggunakan notepad++ anda bisa langsung tekan ctrl+shift+alt+i(untuk IE dan x untuk firefox). Jika anda menggunakan notepad biasa klik 2 kali pada file belajar_javscript.html di direktori penyimpanan file tersebut. Nah hasilnya akan seperti ini teman-teman.

Anda satu program lagi yaitu alert ikuti code berikut

hasilnya..

sekigitu dulu aja yah,,kerjaan menumpuk ,,,he2

Busway Bikin Kesel

Kemaren minggu saya jalan-jalan ke mall bersama beberapa teman naik busway. Wah ga kebayang deh rasanya jadi ikan asin di busway,,udah kalo mau ke haltenya susah banget dari tempat kosan, harus naik angkot dulu yang seper panas, dempet,dempetan trus jalan kaki lagi untuk sampai ke halte busway. Udah gitu kalo hari sabtu ato minggu,and anda ingin jalan-jalan di jakarta,,jangan deh saya saranin apa lagi naik busway,,wah jadi ikan asin beneran. Apalagi kalo anda ingin naik busway disekitar jam-jam sibuk seperti jam pulang kerja dan pagi hari wah bakal antri du halte, desak-desakan dan dempet dempetan, apalagi kalo udah di dalam bis anda harus berdiri kalo ga kebagian tempat duduk. Bergelantungan di dalam bis juga capek banget apalgi dibarengi dengan ngantuk,,ndeh jadi berabeh aja tu..Yang bikin kesalnya bus nya dateng ke halte lama banget,,gila nunguinnya bisa ampe 1 jam untuk satu tujuan doang belum lagi transit ke jalur lainnya.

Udah gitu Yang bikin macet lagi adalah, jalur busway seenaknya saja di pakai ama mobil, motor dan kendaraan lain, sehingga busway ga bisa jalan. Padahalkan konsep awalnya jalur tersebut kan hanya di peruntukkan buat busway,, tapi dasar kita orang yang tidak disiplin dan tidak tertib ya jadi macet. sama aja kan jadinya naik busway dengan naik bus biasa bedanya cuman ada ac nya doang,,kalo masalah macet, dempet,dempetan mah sama aja dengan ankutan lainnya.

Jika saya nilai Pelayanan Busway belum begitu masksimal karena Jumlah trayek dan jalur masih penuh dengan penumpang sedangkan bus yang tersedia hanya beberapa, akhirnya penumpang harus menunggu, apa lagi di tambah cuaca yang panas desak-desakanan bikin emosi melambung tinggi.

Salah satu lagi yang bikin busway kurang nyaman adalah tidak ada informasi yang jelas di halte maupun du bus tentang jalur,,sehingga penumpang harus nanya-nanya dulu ke petugas,,didalam bus pun waktu pemberhentian tidak dikasi tau bahwa ini halte anggrek misalnya,,hanya beberapa bus yang memiliki sistem pemberitahuan .

Hal lain yang munkin bisa dikritik adalah jalur buway yang tidak kompak, artinya untuk ke satu tujuan yang dekat saja harus melalui jarak yang sangat panjang padahal kalo menggunakan kendaraan pribadi sangat dekat, dan ditempuh hanya beberapa menit. Ga efektik banget ga sih? ga efesien lagi..mendingan naik motor dah kata gua kalo kemana-mana di jakarta,, dari pada naik busway yang bikin sakit hati,,,  

 

Membuat Tab Menu Pada Web

Suka dengan CSS menu? cobalah membuat CSS menu anda sendiri.

Berikut ada contoh membuat menu CSS sederhana, untuk proses belajar anda bisa memodifikasinya :)
Code nya:

------------------------------
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta
http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"/>
<title>DHTML Tab,JavaScript Tab</title>
<style type="text/css">
#tabs {display: block;float: left;width: 160px;}
.panel
{border: solid 1px #D8D8D8;border-top: none;background-color:
#FFFFFF;padding: 0px;width: 158px;overflow: auto;clear: left;}
.tab_bdr{padding:
0px;width: 158px;border: 0px;border: 1px solid #645DB5;height:
4px;margin:0px;background: #645DB5;clear: left;font-size: 0px;}
.tab{font-family:tahoma;
FONT-SIZE:
11px;background:#BA0808;color:#FFFFFF;cursor:pointer;border:none;border-bottom:
1px solid #FFFFFF;height:19px;padding-top:3px;margin:0px;width:60px;
float:left; text-decoration:none;}
.tab_sel{font-family:tahoma;
FONT-SIZE:
11px;background:#645DB5;color:#FFFFFF;cursor:pointer;border:none;border-bottom:1px
solid #645DB5;height:19px;padding-top:3px;margin:0px;width:60px;
float:left; text-decoration:none;}
</style>
<script language="JavaScript" type="text/javascript">
var panels = new Array('panel1', 'panel2'); // IDs of the content panels must be put here
var tabs = new Array('tab1', 'tab2'); // IDs of the tabs must be put here
function displayPanel(nval)
{
for(i = 0; i < panels.length; i++)
{

document.getElementById(panels[i]).style.display = (nval-1 == i) ?
'block':'none';

document.getElementById(tabs[i]).className=(nval-1 == i) ?
'tab_sel':'tab';
}
}
</script>
</head>
<body>
<div id="tabs">

<div id="tab1" class="tab_sel" align="center" onClick="javascript:
displayPanel('1');">Tab&nbsp;1</div>

<div id="tab2" class="tab" style="margin-left:1px;" align="center"
onClick="javascript: displayPanel('2');">Tab&nbsp;2</div>
</div>

<div class="tab_bdr"></div> <!-- This is the div used to
show a thick border below the tab and above the panel-->
<div
class="panel" id="panel1" style="display: block">1</div>
<!-- The display panels for the respective tabs can be put here
-->
<div class="panel" id="panel2" style="display: none">2</div>
</body>
</html>
------------------------------

contoh jadi: http://www.ilmuwebsite.com/test/css-tab.htm
Terimakasih

Sumber dari situs Ilmu Website dalam kategori html dengan judul Tab CSS Menu Sederhana