Cara Membuat Text Area dengan Tombol Select All | AlfianCMX

Cara Membuat Text Area dengan Tombol Select All | AlfianCMX

Cara Membuat Text Area dengan Tombol Select All

Cara Membuat Text Area dengan Tombol Select All
Image by alfianCMX
Cara Membuat Text Area dengan Tombol Select All - Teks area adalah sebuah kotak persegi yang digunakan untuk memuat kode scrpit HTML. Dimana kotak tersebut digunakan untuk tempat menyimpan atau menampilkan kode" HTML dalam bentuk text. 
Dan dipembahasan kali ini saya akan memberikan tutorial Cara Membuat Text Area dengan Tombol Select All. Ini merupakan modifikasi dari text area itu sendiri dimana ditambahkan tombol Select All. tentunya agar mempermudah pengunjung untuk mendapatkan kode HTML tanpa susah" memblok kodenya kebawah.
Dibawah ini saya akan berikan gambaran asli dari text area, dan gambaran text area dengan menggunakan tombol Select All. Sobat juga dapat memodifikasi sesuai keinginan sobat. Oke disimak baik-baik ya

  • Kode dasar text area 

Kotak diatas merupakan dasar dari text area , untuk membuat kotak seperti itu sangatlah mudah sobat , copy paste kode dibawah ini lalu letakkan di HTML disamping Compose : <textarea cols="27" rows="1" Belajar membuat Text Area :) </textarea> Keterangan : Rubah cols , rows dan "Belajar membuat Text Area :)" sesuai yang kalian inginkan.
  • Kode text area dengan tombol Select All



Nah kalo kotak diatas merupakan modifikasi dari text area, disini sana menambahkan tombol Select All dan juga background pada kotak text area.Copy paste kode dibawah ini kemudian letakkan di HTML disamping Compose :
<div><form name="copy"><div align="center"><input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Select All" /><div align="center"><textarea cols="55" readonly="name="txt" rows="100" style="background: #1b1b1d; color: white; height: 60px; width: 400px;" wrap="VIRTUAL">Ketik teks/kode html yang anda inginkan :)</textarea></div></form></div>

  • Keterangan :

[<div align="center">]
Kode diatas merupakan kode agar kotak text area menjadi center (rata tengah) , sobat bisa merubahnya menjadi rata kiri atau juga rata kanan.
[<input onclick="javascript:this.form.txt.focus();this.form.txt.select();"]
Kode diatas merupakan kode yang memuat perintah block all. Jadi agar tidak terjadi eror , kode ini tidak usah dirubah-rubah.
[type="button" value="Select All" />]
Yang diblok merah merupakan nama dari tombolnya, dan dapat diganti sesuai keinginan anda masing-masing.
[readonly="]
Kode diatas berfungsi sebagai pengunci tulisan yang berada ditextarea agar tidak dapat dirubah. Kode ini cukup penting,terutama untuk text area yang berisi script agar pembaca tidak dapat mengubah isi didalam kotak textarea.
[style="background: #1b1b1d; color: white; height: 60px; width: 400px;"]
Kode diatas merupakan kode untuk merubah background , tinggi dan lebar kotak textarea, sobat bisa merubahnya sesuai selera. Jika tulisan yang berada didalam kotak text area banyak, maka akan muncul scroll secara otomatis. Dan jika sobat menginginkan background berwarna putih hapus saja kode background: #1b1b1d;
[Ketik teks/kode html yang anda inginkan :)]
Merupakan isi dari kotak pada text area , silakan ganti dengan kebutuhan sobat dan jika tulisan yang berada didalam kotak text area banyak, maka akan muncul scroll secara otomatis.
Baca juga MENGATASI TOMBOL BALAS/REPLY YANG TIDAK BERFUNGSI
Warna-warni banget ya postinganku kali ini ?hahahaa :P. Gimana sobat mudah sekali kan ? jika sobat ingin bereksperimen silakan klik link ini http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_textarea. Oke sobat sekian yang bisa saya share tentang Cara Membuat Text Area dengan Tombol Select All. Tunggu update-update selanjutnya yang pastinya semakin bermanfaat untuk anda. Selamat mencoba :)

Penulis : Alfian Akhmad Sholekhan ~ Anda senang beritahu teman, Anda kecewa beritahu saya :)

Artikel Cara Membuat Text Area dengan Tombol Select All ini dipublish oleh Alfian Akhmad Sholekhan pada hari Sunday, 27 April 2014. Semoga artikel ini dapat bermanfaat. Mohon maaf apabila konten yang anda baca rusak atau salah dalam penulisan. Jika ada pertanyaan, kritik, dan saran yang ingin di sampaikan silahkan tinggalkan komentar sudah ada 5 komentar: di postingan Cara Membuat Text Area dengan Tombol Select All Terimakasih atas kunjungan Anda :)
Alfian Akhmad Sholekhan
alfianCMXUpdated at : 20:00:00
 
Related Posts Plugin for WordPress, Blogger...