TERSEDIA : BUKU ANALISIS - BUKU BIOGRAFI - BUKU BISNIS - BUKU CERITA - BUKU DEWASA - BUKU HUMOR - BUKU MANAJEMEN - BUKU MOTIVASI - BUKU NOVEL - BUKU PELAJARAN - BUKU PERDAGANGAN - BUKU PSIKOLOGI - BUKU RELIGI - BUKU TUTORIAL - GADGET HEWAN - GADGET PERMAINAN - GADGET JAM - GADGET KALENDER - RANGKAIAN ELEKTRONIKA - SMS GRATIS

Saturday, October 22, 2011

Text area dengan latar belakang bergambar dan tombol Block All

Text area akan kelihatan semakin menarik jika memiliki latar belakang gambar dan diatasnya terdapat tombol Block All yang berfungsi untuk memblok semua tulisan yang berada di dalam text area. Berikut ini adalah kode text area dengan latar belakang bergambar dan tombol Block All

<form name="copy">
<div align="center">
<input onclick="javascript:
this.form.txt.focus();this.form.txt.select();" type="button" value="Block All" /></div>
<div style="text-align: center;">
<textarea name="txt" style="background-image: url(&quot;http://i1128.photobucket.com/albums/m486/syamsudin1/boy_365-x-100.gif&quot;); background-repeat: no-repeat; height: 90px; padding: 5px; width: 360px;">
TULIS  TEKS YANG AKAN DITAMPILKAN DISINI
</textarea></div>
</form>

Contoh tampilannya:

Keterangan :
a.         <div align="center">
Kata center menunjukan bahwa posisi tombol akan berada di tengah, jika anda ingin posisi tombol berada di tepi sebelah kiri, maka anda ganti dengan kata left. Dan jika anda ingin posisi tombol berada di tepi sebelah kanan, tinggal ganti dengan kata right.
b.        value="Block All"
Kata Block All adalah kata yang akan muncul di dalam tombol dan bisa anda ubah dengan kata yang anda inginkan.
c.         http://i1128.photobucket.com/albums/m486/syamsudin1/boy_365-x-100.gif
Url gambar latar belakang text area dan bisa anda ganti dengan url gambar yang lain
d.        height: 90px;
Angka 90 menunjukkan ukuran tinggi text area dan bisa anda ganti dengan ukuran yang lainnya
e.         width: 360px;
Angka 360 menunjukkan ukuran tinggi text area dan bisa anda ganti dengan ukuran yang lainnya

Komentar
0 Tanggapan
Tweet

0 comment:

Post a Comment

 
Obrolan