Cara Membuat Text Area HighLight

Mengenai blog tutorial tntang teks area sudah saya jelaskan pada postingan sebelumnya di Membuat Teks Area, Tutorial berikutnya tentang teks area adalah teks area dengan menggunakan Tombol Highlight. Tombol Highlight tersebut berfungsi buat memudahkan para pembaca blog untuk mengcopy seluruh isi di dalam kotak teks area tanpa terlewati, Text Area Tombol Highlight akan memblok semua content yang ada di dalam kolom Text Area hanya dengan menekan tombol highlight, selanjutnya kita tinggal mengcopy saja dan menyimpan content tersebut dengan Ctrl+c.

Fasilitas Text Area Highlight ini sangat berguna untuk keamanan teks / kode-kode yang akan di copy dalan jumlah banyak sekalipun. Jadi anda tidak perlu cemas akan tertinggalnya teks / kode-kode yang sudah di copy, yang akan anda simpan buat kepentingan anda. Jika anda ingin menggunkan Text Area biasa Tutorialnya disini

Cukup jelas dengan keterangan teks area diatas? Untuk membuat Teks area Highlight pada blog cara dan  langkah untuk Membuat Text Area HighLight seperti berikut:

Silahkan anda copy kode HTML di bawah ini, cara memasangannya sama dengan cara membuat teks area pada postingan Membuat Teks Area

<div><form name="copy"><div align="center"><input onclick="javascript:this.form.txt.focus();this.form.txt.select();" value="Highlight All" type="button"> </div><div align="center"></div><p align="center"><textarea style="width: 300px; height: 144px;" name="txt" rows="100" wrap="VIRTUAL" cols="55">Tulis teks/kode-kode yang ingin anda tampilkan pada kotak teks area </textarea></p></form></div>

Sebagai contoh :

<div><form name="copy"><div align="center"><input onclick="javascript:this.form.txt.focus();this.form.txt.select();" value="Highlight All" type="button"> </div><div align="center"></div><p align="center"><textarea style="width: 300px; height: 144px;" name="txt" rows="100" wrap="VIRTUAL" cols="55">Tulis teks/kode-kode yang ingin anda tampilkan pada kotak teks area </textarea></p></form></div>

Keterangan:

<div align="center"> -->mengartikan kalimat bahwa tombol HighLight berada tepat di tengahkotak teks area,jika anda ingin merubah tombolnya berada di sebelah kiri, ganti saja "center" dengan kata "left", dan jika ingin berada di sebelah kanan,ganti saja "center" dengan kata "right".

<input onclick="javascript:this.form.txt.focus();this.form.txt.selec()"> --> kode ini artinya ketika tombol highlight di klik, maka seluruh text yang ada di dalamnya akan di blok.

Value="Highlight All" --> kata Highlight All adalah tombol yang akan muncul di diatas kotak teks area, jadi jika anda ingin merubah tulisan ini silahkan ganti dengan kata yang anda inginkan.

Element teks area :

<p align="center"> --> mengartikan kalimat bahwa tombol HighLight berada tepat di tengah kotak teks area,jika anda ingin merubah tombolnya berada di sebelah kiri, ganti saja "center" dengan kata "left", dan jika ingin berada di sebelah kanan,ganti saja "center" dengan kata "right".

<text style="width: 300px;">-->kata "WIDTH:300px" --> menunjukan lebar dari text area tersebut sebanyak 300 pixel, anda bisa merubahnya dengan angka yang anda inginkan. misal: "WIDTH:500px;"

HEIGHT: 144px --> angka "144px" mengartikan tinggi teks area adalah 144 px, jadi jika anda ingin merubahnya tinggal ganti angka tersebut dengan angka yang anda inginkan. Misal : HEIGHT:160px.

Selamat mencoba!!!!!!!!!!

Artikel Terkait:

Posted in: Tutorial Blog