JAVASCRIPT
PENGERTIAN JAVASCRIPT
Menurut wikipedia, JavaScript adalah bahasa skrip yang populer di internet dan dapat bekerja di sebagian besar penjelajah web populer seperti Internet Explorer (IE), Mozilla Firefox, Netscape dan Opera. Kode JavaScript dapat disisipkan dalam halaman web menggunakan tag SCRIPT.Javascript adalah sebuah bahasa komputer atau kode pemrograman yang digunakan pada website agar website tersebut menjadi lebih interaktif dan dinamis.
FUNGSI JAVASCRIPT
Untuk menjaga browser dari mengeksekusi sebuah script ketika beban halaman, Anda dapat menempatkan script Anda ke fungsi.Sebuah fungsi berisi kode yang akan dieksekusi oleh peristiwa atau dengan panggilan ke fungsi.Anda dapat memanggil fungsi dari manapun di halaman (atau bahkan dari halaman lain jika fungsi tertanam dalam file js eksternal.).Fungsi dapat didefinisikan baik dalam <head> dan di bagian <body> dokumen. Namun, untuk memastikan bahwa fungsi dibaca / dimuat oleh browser sebelum dipanggil, itu bisa bijaksana untuk menempatkan fungsi dalam bagian <head>.
Syntax :
function functionname(var1,var2,…,varX)Parameter var1, var2, dll variabel atau nilai-nilai dilewatkan ke fungsi. Para {dan} mendefinisikan awal dan akhir fungsi.
{
some code
}
Catatan: Sebuah fungsi tanpa parameter harus menyertakan tanda kurung () setelah nama fungsi.
Catatan: Jangan lupa tentang pentingnya modal dalam JavaScript! Fungsi kata harus ditulis dalam huruf kecil, jika tidak terjadi kesalahan JavaScript! Juga perhatikan bahwa Anda harus memanggil fungsi dengan ibukota yang sama persis seperti dalam nama fungsi.
CONTOH FUNGSI JAVASCRIPT
<html>Jika garis: alert (“!! Halo dunia”) pada contoh di atas tidak dimasukkan dalam fungsi, itu akan dieksekusi segera setelah halaman itu dimuat. Sekarang, script tidak dijalankan sebelum pengguna menekan tombol input. Para displaymessage function () akan dieksekusi jika tombol input diklik.
<head>
<script type=”text/javascript”>
function displaymessage()
{
alert(“Hello World!”);
}
</script>
</head>
<body>
<form>
<input type=”button” value=”Click me!” onclick=”displaymessage()” />
</form>
</body>
</html>
Anda akan belajar lebih banyak tentang peristiwa JavaScript di JS Peristiwa bab.
THE RETURN STATEMENT ( PERNYATAAN KEMBALI )
Pernyataan return digunakan untuk menentukan nilai yang dikembalikan dari fungsi.Jadi, fungsi yang akan mengembalikan nilai harus menggunakan pernyataan kembali.Contoh di bawah ini mengembalikan produk dari dua bilangan (a dan b):Contoh :
<html>
<head>
<script type=”text/javascript”>
function product(a,b)
{
return a*b;
}
</script>
</head>
<body>
<script type=”text/javascript”>
document.write(product(4,3));
</script>
</body>
</html>
LIFETIME DARI VARIABEL JAVASCRIPT
Jika Anda mendeklarasikan variabel, menggunakan “var”, dalam fungsi, variabel hanya dapat diakses dalam fungsi itu. Ketika Anda keluar dari fungsi, variabel ini hancur. Variabel ini disebut variabel lokal. Anda dapat memiliki variabel lokal dengan nama yang sama dalam fungsi yang berbeda, karena masing-masing diakui hanya oleh fungsi yang dinyatakan.Jika Anda mendeklarasikan variabel di luar fungsi, semua fungsi pada halaman Anda dapat mengaksesnya. Masa ini variabel dimulai ketika mereka dinyatakan, dan berakhir ketika halaman tersebut ditutup.
MINGGU, 09 AGUSTUS 2015
mempelajari CSS (Cascading Style Sheet)
Cascading stylesheet atau biasa disebut CSS merupakan teknologi yang digunakan dalam design website. Mungkin dapat dikatakan 100td_persen website yang ada sekarang sudah menggunakan CSS, karena memang CSS sangat diperlukan dalam mempercantik tampilan website.
1. CSS Font
CSS Font digunakan untuk mengatur font dalam tampilan halaman website. CSS Font antara lain :
Font digunakan untuk mengatur font secara umum, penulisan perntah font adalah sebagai berikut :
font: normal 12px/14px Arial, helvetica, sans serif;
- normal untuk menentukan tebal atau tipisnya font
- 12px/14px untuk menentukan ukuran terkecil font dan ukuran maximalnya
- Arial, helvetica dst digunakan untuk memilih jenis font yang akan digunakan
Font-family digunakan untuk menentukan jenis font yang akan digunakan
Font-size digunakan untuk menentukan ukuran font
Font-style digunakan untuk mentukan style dari font yang kita gunakan, misalnya italic atau normal
Font-weight juga digunakan untuk menentukan tebal tipisnya font yang dipakai
CSS Font digunakan untuk mengatur font dalam tampilan halaman website. CSS Font antara lain :
Font digunakan untuk mengatur font secara umum, penulisan perntah font adalah sebagai berikut :
font: normal 12px/14px Arial, helvetica, sans serif;
- normal untuk menentukan tebal atau tipisnya font
- 12px/14px untuk menentukan ukuran terkecil font dan ukuran maximalnya
- Arial, helvetica dst digunakan untuk memilih jenis font yang akan digunakan
Font-family digunakan untuk menentukan jenis font yang akan digunakan
Font-size digunakan untuk menentukan ukuran font
Font-style digunakan untuk mentukan style dari font yang kita gunakan, misalnya italic atau normal
Font-weight juga digunakan untuk menentukan tebal tipisnya font yang dipakai
2. CSS Background
Digunakan untuk mengatur background suatu area atau bagian dalam halaman website.
Berikut penjelasan dari beberapa perintah css background
background digunakan untuk mengatur background secara umum, yaitu bisa berbentuk background gambar atau background warna. Perhatikan contoh berikut :
background:blue;
background:url(images/gambar.gif);
background-attachment digunakan untuk mengatur posisi background gambar pada halaman website, dimana background gambar dapat di set statis, sehingga walaupun pengunjung menggerakan scroll browser ke atas atau ke bawah, background akan tetap pada posisinya.
Background-position digunakan untuk mengatur posisi background gambar. Dimana background gambar dapat diset pada bagian atas, bawah, kanan atau kiri pada sebuah area tertentu
Background-repeat digunakan untuk mengatur perulangan background gambar
3. CSS Border atau garis tepi
Berikut penjelasan dari beberapa macam perintah css border:
Border digunakan untuk membuat garis tepi pada sebuah area dalam halaman website. Perintah yang umum digunakan antara lain:
Border: #warna ukuran tipe_border
perhatikan contoh berikut :
Border: silver 1px solid;
perlu diingat bahwa perintah diatas akan membuat border keseluruha, yaitu border atas, kanan, bawah dan juga border kiri. Jika kita hanya memerlukan border pada bagian tertentu, gunakan perintah
border-top, border-right , border-bottom dan border-left, contoh border-bottom:#ff9900 2px solid;
4. CSS Margin dan Padding
Margin merupakan jarak keluar antara sebuah elemen dengan elemen lainnya dalam halaman website, sedangkan Padding merupakan jarak kedalam sebuah elemen dengan value atau isi dari elemen tersebut. Beberapa contoh penulisan perintah Margin dan padding dapat dilihat pada contoh berikut:
margin:10px 0 0 0;
padding:0 0 0 10px;
Penulisan diatas merupakan cara pengaturan margin dan padding secara berurutan, yang dimulai dari Atas, Kanan, Bawah dan kiri
Bagaimana CSS dapat mengenali bagian – bagian dalam halaman html?
Jawabannya adalah dengan 3 selektor berikut :
1. Mengenali TAG atau perintah html
2. Mengenali Class pada bagian – bagian tertentu halaman html
3. Mengenali ID bagian – bagian tertentu dalam sebuah halaman html
Pembahasan tentang Selektor pada CSS akan kita bahas pada tutorial selanjutnya, silahkan tuliskan komentar ada pada form dibawah atau kirimkan request anda pada link ini untuk dapat kami bahas pada tutorial selanjutnya.
Sifat CSS
Ada dua sifat CSS yaitu internal dan eksternal. Jika internal yang dipilih, maka skrip itu dimasukkan secara langsung ke halaman website yang akan didesain. Kalau halaman web yang lain akan didesain dengan model yang sama, maka skrip CSS itu harus dimasukkan lagi ke dalam halaman web yang lain itu.
Sifat yang kedua adalah eksternal di mana skrip CSS dipisahkan dan diletakkan dalam berkas khusus. Nanti, cukup gunakan semacam tautan menuju berkas CSS itu jika halaman web yang didesain akan dibuat seperti model yang ada di skrip tersebut.
Ada dua sifat CSS yaitu internal dan eksternal. Jika internal yang dipilih, maka skrip itu dimasukkan secara langsung ke halaman website yang akan didesain. Kalau halaman web yang lain akan didesain dengan model yang sama, maka skrip CSS itu harus dimasukkan lagi ke dalam halaman web yang lain itu.
Sifat yang kedua adalah eksternal di mana skrip CSS dipisahkan dan diletakkan dalam berkas khusus. Nanti, cukup gunakan semacam tautan menuju berkas CSS itu jika halaman web yang didesain akan dibuat seperti model yang ada di skrip tersebut.
Fakta Menggunakan CSS
Fakta Menggunakan CSS diantaranya :
- Telah didukung oleh kebanyakan browser versi terbaru, tetapi tidak didukung oleh browser-browser lama.
- Lebih fleksibel dalam penempatan posisi layout. Dalam layouting CSS, kita mengenal Z-Index untuk menempatkan objek dalam posisi yang sama.
- Menjaga HTML dalam penggunaan tag yang minimal, hal ini berpengaruh terhadap ukuran berkas dan kecepatan pengunduhan.
- Dapat menampilkan konten utama terlebih dahulu, sementara gambar dapat ditampilkan sesudahnya.
- Penerjemahan CSS setiap browser berbeda, tata letak akan berubah jika dilihat di berbagai browser
- CSS adalah layouting "Masa Depan" dengan penggabungan bersama XHTML.
JUMAT, 07 AGUSTUS 2015
Pengertian Dan Pengertian HTML
HTML (HyperText Mark up Language) merupakan suatu metoda untuk mengimplementasikan konsep hypertext dalam suatu naskah atau dokumen.
HTML sendiri bukan tergolong pada suatu bahasa pemrograman karena sifatnya yang hanya memberikan tanda (marking up) pada suatu naskah teks dan bukan sebagai program.
Pengertian HTML bila di jabarkan berdasarkan kata-kata penyusunnya HTML nya adalah sebagai berikut:
Hypertext
Link hypertext adalah kata atau frase yang dapat menunjukkan hubungan suatu naskah dokumen dengan naskah-naskah lainnya. Jika kita klik pada kata atau frase untuk mengikuti link ini maka web browser akan memindahkan tampilan pada bagian lain dari naskah atau dokumen yang kita tuju.
Markup
Pada pengertiannya di sini markup menunjukkan bahwa pada file HTML berisi suatu intruksi tertentu yang dapat memberikan suatu format pada dokumen yang akan ditampilkan pada World Wide Web.
Language
Meski HTML sendiri bukan merupakan bahasa pemrograman, HTML merupakan kumpulan dari beberapa instruksi yang dapat digunakan untuk mengubah-ubah format suatu naskah atau dokumen.
Pada awalnya HTML dikembangkan sebagai subset SGML (Standard Generalized Mark-up Language). Karena HTML didedikasikan untuk ditransmisikan melalui media Internet, maka HTML relatif lebih sederhana daripada SGML yang lebih ditekankan pada format dokumen yang berorientasi pada aplikasi.
Adapun Perintah - Perintah Dasar dari HTML adalah sebagai berikut:
<H2> </H2>
.... ....
<H6> </H6>font semakin kecil
Fungsi : perintah untuk membuat garis horizontal penuh layar
Fungsi : membuat teks miring
Fungsi : membuat teks tebal
5. <U>
Fungsi : membuat teks bergaris bawah
6. <CENTER>
Fungsi : membuat text ke tengah layar
7. <ALIGN>
Fungsi : Membuat teks rata kiri dan rata kanan
Sintak
<P ALIGN=right>untuk rata kanan
<P ALIGN=left>untuk rata kiri
<P ALIGN=center>untuk rata tengah
<P ALIGN=justify>untuk rata kiri dan rata kanan
<H?ALIGN=right>
<H?ALIGN=left>
<H?ALIGN=center>
<H?ALIGN=justify>
Contoh pemakaian:
<H2 Align=right>Selamat Datang Ke Website Kami <H2>
8. <BR>
Fungsi : memasukkan fungsi enter
Cth : Jika perintah <BR> diberikan di awal atau diakhir baris, maka kalimat berikutnya akan dicetak pada baris berikutnya
9. <!->
Fungsi : membuat komentar
Semua teks atau perintah yang diapit oleh perintah ini tidak akan dijalankan
10. <P>
Fungsi : memisahkan paragraph yang satu dengan paragraph yang lain
11. <DD>
Fungsi : membuat teks atau sebuah paragraph agak masuk ke dalam
12. <BASEFONT>
Fungsi : Mengubah ukuran font
Contoh :
<BASEFONT SIZE=6>
WELCOME TO MY WEBSITE
<B>WELCOME TO MY WEBSITE DAN TEBAL</B>
13. <FONT>
Fungsi : mengubah ukuran font, tetapi angka yang terdapat dalam size yang merupakan ukuran font harus diberi tanda kutib
14. <FACE>
Fungsi : mengubah jenis font
15. <SUP>
Fungsi : membuat cetak naik suatu teks
Contoh :
Kami adalah yang pertama:1stin the world
16. <SUB>
Fungsi : membuat suatu teks cetak turun
Contoh :
contoh-contoh teks cetak turun :
H2O (Disebut Air) dan
C2127No (Disebut Methadon)
17. <UL> atau Unorder List
Fungsi : membuat bullet
18. <LI>
Fungsi : juga untuk membuat bullet
Catatan : perintah <LI> harus berada dalam perintah OL,UL,DIR,Menu
Contoh :
<UL>
<LI>
<H2> Jawa Timur </H2>
<UL>
<LI> SURABAYA </LI>
<LI> MALANG </LI>
<LI> GRESIK </LI>
</UL>
</LI>
</BR>
<LI>
<H2> Jawa Barat </H2>
<UL>
<LI> Bandung </LI>
<LI> Sukabumi </LI>
<LI> Bogor </LI>
</UL>
</LI>
</UL>
19. <IMGSRC>
Fungsi : memasukkan gambar ke dalam Website
Anda dapat juga memasukkan gambar berakhiran *.Jpg, *.Gif, *.Bmp dll
Sintak :<IMG BORDER="5">
"5" merupakan ukuran border(Bingkai), ganti angka ini sesuai keinginan anda
20. <BGSOUND>
Fungsi : memasukkan suara atau musik ke dalam Website
Sintak : <BGSOUND loop=infite Src="d:/Selamat datang.WAV">
Link dengan sorot
Berikut adalah contoh program bagaimana membuat link hanya dengan sorot saja (link tak perlu diklik, tetapi cukup disorot dengan mouse.
<HTML>
<HEAD>
<TITLE> </TITLE>
<META Name="description"Content=" ">
<META Name="keywords"Content=" ">
<META Name="generator"Content="Cute HTML">
</HEAD>
<BODY BG Color="#FFFFFF"Text="#000000="#"0000FF"VLink="#800080">
<Center>
<A href=" "target=main on mouse over="Window.open('c:/html/keterangan.html'):">
<Font Size=3 FACE=Arial Color=#804000> Keterangan </FONT> </e>
</CENTER>
</BODY>
</HTML>
Link dengan tombol
Berikut adalah contoh program link dengan tombol
Sintak :
<Input type="button"Value="Nama Tombol"
On Click="parent.location="Link anda disini" >
Contoh
Buatlah link dengan nama
tentang_kami.html
produk_kami.html
cara_memesan.html
< HTML >
< HEAD >
< TITLE > </TITLE>
< META name="description"Content=" ">
< META name="keywords"Content=" ">
< META name="generator"Content="Cute HTML">
< /HEAD >
< BODY BGCOLOR="#FFFFFF"Text="#000000"Vlink="#800080" >
< Center >
< h1 > PT.OCTA >
< Input Type="button"value="Tentang Kami"
on click="parent.location="c:/website/tentang_kami.html'" >
< Input Type="button"value="Produk Kami"
on click="parent.location="c:/gambar/produk_kami.html'" >
< Input Type="button"value="cara memesan"
on click="parent.location="c:/gambar/cara_memesan.html'" >
< /Center >
< /Body >
< /HTML >
Kolom
< tr > adalah perintah untuk membuat kolom pada notepad
Berikut adalah contoh perintah cara membuat kolom pada notepad
< html >
< head >
< title > Belajar membuat kolom < /title >
< /head >
< H3 Align="Center" > DAFTAR MAHASISWA < H3 >
< table border="3" border color="red"
< tr >
< td > No
< td > Nama
< td > Alamat
< td > No. Phone
< td > Gambar
< /tr >
< tr >
< td > 1
< td > Octa
< td > Padang Bulan
< td > 8214773
< td > < Img src="C:\Documents and Settings\XP\My Documents\My Webs\octa_pic1.JPG" > < /tr >
Hasilnya menjadi
Membuat Frame
-Framecols : membagi layar dalam bentuk kolom
-FrameRows : membagi layar dengan bentuk baris
-Frame Src : menampilkan file dalam frame
Bentuknya
(Frame cols="30%,*")
(Frame Src="Nama.file Name="Teks")
(Frame Rows="40%,*")
(Frame Src="Nama.file"Nama="teks")
(Frame Src="Nama.file"Nama="Teks)
(/Frameset)
Contoh Program Frame
< Html >
< Head >
< Title >Melink dengan sorot < /Title >
< /Head >
< Frameset cols="30%,*" >
< Frame Src="Nama file"Nama="Teks" >
< Frame Rows="40%%,*" >
< Frame Src="Gambar File’Nama="Gambar" >
< Frame Src="Nama File"Nama="Teks >
< /Frameset >
Contoh HTML :
struktur dasar bahasa HTML.
<html>
<head>
<title> tempat menulis judul halaman web </html>
<head>
<body>
tempat untuk menulis isi dari halaman web
</body>
</html>
kita coba latihan,,
langkah pertama
buka lah satu program aplikasi pengolah kata seperti notepad atau wordpad ataupun aplikasi pengolah kata lainnya.
langkah kedua
tuliskan tag html di bawah ini pada aplikasi pengolah kata:
<html>
<head>
<title>
LATIHAN 1 HTML OLEH ALIM di INDONESI4KU.WORDPRESS.COM
</title>
</head>
<body>
<br>
<p>HTML adalah bahasa standar yang digunakan untuk membuat halaman web.<br>
salah satu tutorial atau contoh latihannya dapat kita lihat di situs<br>
Indonesi4ku.wordpress.com.
</body>
</html>
langkah ketiga
simpanlah file tadi dengan ekstensi atau tipe file “.html”. contoh: latihan1.html
langkah keempat
bukalah file yang sudah kita simpan tadi, dengan cara mengklik dua kali pada nama filenya.
Tidak ada komentar:
Posting Komentar