rss

TUTORIAL 8 (Text Area Highlight Bagian Kedua)

Pada dasarnya, langkah membuat Text Area menggunakan Highlight dengan Text Area yang dijelaskan pada posting artikel terdahulu adalah sama. Yang membedakan adalah hasil dari bentuk Text Area tersebut. Text Area dengan Highlight memang lebih memudahkan pengunjung dalam meng-copy isi dari Text Area, karena hanya sekali tekan saja isi kode-kode dalam Text Area area tersebut langsung di Highlight dan anda tinggal copy saja.
Keuntungan dengan model Highlight adalah apabila isi kode-kode dalam Text Area dalam jumlah yang sangat banyak, bisa di copy semua tanpa harus melakukan highlight manual dengan mouse atau keyboard. Keuntungan lainnya, resiko adanya kode yang tertinggal apabila di copy sangat kecil.


Untuk langkah-langkahnya sama seperti yang saya jelaskan pada posting artikel terdahulu, hanya kode HTML yang anda masukan ke HTML JavaScript berbeda. Berikut kode yang harus anda copy :

<div><form name="copy"><div align="center"><input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Highlight All"> </div><div align="center"></div><p align="center"><textarea style="WIDTH: 300px; HEIGHT: 144px" name="txt" rows="100" wrap="VIRTUAL" cols="55"> Tuliskan kata-kata disini,misalkan alamat blog atau nama blog anda </textarea></p></div></form>

Supaya anda lebih memahami kode di atas, mari kita jelaskan bersama. Kode di atas memiliki dua bagian kode HTML, yakni kode HTML untuk membuat tombol yang bertuliskan Highlight All, dan yang kedua adalah kode HTML untuk membuat text area.
Bagian tombol Highlight All :

1. <div align="center">
Pada kata center menjelaskan bahwa posisi tombol Highhlight akan berada di tengah, jadi bila anda ingin posisi tombol berada di tepi sebelah kiri atau sebelah kanan, anda tinggal menggantinya kata-katanya. Kata left untuk sebelah kiri dan sebelah kanan kata right.

2. <input onclick="javascript:this.form.txt.focus();this.form.txt.select()">
Pada kode ini artinya saat tombol Highlight di klik pada Text Area, maka seluruh text yang ada di dalamnya akan di Highlight (ditandai atau di blok).

3. Value="Highlight All"
Pada kata Highlight All merupakan kata yang akan muncul di dalam tombol, bila anda ingin mengubah tulisan ini, silahkan ganti dengan kata yang sesuai keinginan anda.

Bagian Text Area :

1. <p align="center">
Pada kode ini akan menunjukan Text Area berada di posisi tengah, bila anda ingin Text Area anda rata sebelah kiri, gantilah kata center dengan left, sebelah kanan ganti dengan kata right.

2. <text style="WIDTH: 300px">
Pada kode ini kata "WIDTH:300px" menjelaskan lebar dari Text Area sebesar 300 pixel, untuk menyesuaikan dengan sidebar template blog anda, silahkan anda ganti angka 300 nya.

3. HEIGHT: 144px pada angka "144px"
Kode ini menjelaskan Text Area memiliki tinggi sebesar 144px, sama juga dengan lebar Text Area, bila anda ingin mengubah tinggi rendah Text Area anda tinggal mengubah angkanya saja.

Selamat Belajar, Semoga Sukses

No comments:

Post a Comment

Give Me Your Comment, No SPAM No JUNK:

Posting Terbaru

 

Pengikut Blog Ini