Yovi Prasetyo Ardi

Selasa, 03 Februari 2015

HTML - Membuat Textarea Non-Resizeable

Mungkin beberapa pemula dalam desain web seperti saya masih kebingungan ketika ingin membuat textarea tidak bisa diubah ukurannya. Namun setelah mencari dan terus mencari akhirnya saya ketemu caranya dan ingin membagikan Cara Membuat Textarea Tidak Bisa Diubah Ukurannya. Sebelumnya saya akan memberikan contoh textarea biasa. Dengan html bisa menggunakan sintaks <textarea> </textarea>. Atau full kodenya seperti ini:

<html>

<head>

<title>Tutorial TEXTAREA</title>

</head>

<body>

<textarea placeholder="Apa yang anda pikirkan?"></textarea>

</body>

</html>

Maka akan hasilnya akan seperti ini

Terlihat text area di atas di pojok kanan bawah terdapat garis-garis yang menandakan bahwa textarea tersebut bisa diubah ukurannya. Seperti ini contohnya

Hal seperti ini bisa sangat mengganggu bagi orang yang ingin tidak bisa diubah ukurannya.

Maka dari itu, tambahkan CSS seperti di bawah ini

textarea{

resize:none;

}

CSS tersebut menunjukkan selectornya adalah textarea, tentu saja jika di website terdapat banyak textarea namun hanya ingin beberapa textarea yang ingin dijadikan tidak bisa diubah ukurannya gunakan id atau class. Intinya di sini adalah menambahkan CSS. Jika kode html di atas dimasukkan CSS tersebut maka kodenya akan jadi seperti ini:

<html>

<head>

<title>Tutorial TEXTAREA</title>

<style type="text/css">

textarea{

resize:none;

}

</style>

</head>

<body>

<textarea placeholder="Apa yang anda pikirkan?"></textarea>

</body>

</html>

Maka hasilnya akan jadi seperti ini:

Terlihat bedanya dengan textarea yang pertama. Tapi, apakah anda curiga dengan tulisan "Apa yang anda pikirkan?" ? Tulisan tersebut ada di dalam attribut placeholder. Apa itu? Coba cek di tulisan saya tentang HTML Attribut Placeholder.

HTML - Atribut Placeholder Pada Input Text

Pada tutorial html kali ini akan menjelaskan sesingkat-singkatnya tentang apa yang disebut atribut placeholder pada textarea. Pernahkah anda melihat sebuah textarea yang di dalamnya telah terdapat teks dan ketika diklik teks itu hilang? Itulah yang dinamakan placeholder. Placeholder tidak hanya bisa diletakkan di textarea saja. Namun, juga bisa diletakkan di input. Jadi, mungkin banyak pencarian yang menggunakan keywords Membuat Teks Di Dalam Teksarea Kemudian Diklik Hilang, padahal yang dicari sebenarnya adalah Placeholder. Berikut ss dari placeholder.

Secara default warna dari teks placeholder adalah abu-abu. Tentu saja kontras dengan warna teks aktif. Dan cara membuat teks placeholder tersebut adalah tinggal memasukkan atribut placeholder yaitu

placeholder="teks"

Contohnya di textarea tinggal ketikkan atau copas kode html berikut

<textarea placeholder="Apa yang anda pikirkan?"></textarea>

Maka jadinya akan seperti ini:

Atau bisa juga dimasukkan di dalam input. Tinggal masukkan di dalam tag input. Contohnya

<input type="text" placeholder="username" />

Maka akan jadi seperti ini:

bahkan placeholder bisa dimasukkan ke dalam input yang tipenya password dan email.

Minggu, 01 Februari 2015

Mencintai Tak Akan Sepahit Ini

Ketika aku melihat tempat itu seakan aku melihat monumen cinta. Di situlah hampir setiap hari kami menghabiskan waktu dengan beberapa teman kami. Saling bertukar pikiran dan saling bertukar mimpi ingin menjadi apa kami di kemudian hari. Namun masih teringat di pikiranku walaupun di sana banyak sekali orang berbicara ketika aku melihat dia seolah batin kami sedang melakukan percakapan pribadi. Hanya dengan lemparan senyumku dia bisa mengetahui apa yang aku bisikan kepadanya. Pun arti senyum balasannya. Dialog kami berdua bukan sekedar dialog semata. Dialog tingkat tinggi yang hanya bisa dilakukan oleh dua orang yang saling mencintai. Hanya aku dan dia yang bisa menangkap dan menerjemahkan dan saling berbalas.

Aku berjalan mendekati tempat itu. Memandangi barang-barang kenangan sisa perjuanganku dahulu. Lemari usang tempat aku sering menyimpan pakaian, kompor gas yang tak pernah dipakai, papan tulis dengan dua spidol dan satu penghapus di sampingnya. Pikiranku kembali ke memori masa lalu ketika aku melihat sebuah proposal tergeletak. Aku masih ingat bagaimana kita berunding cukup lama untuk merencanakan suatu kegiatan, menghitung estimasi dana yang akan kami ajukan, juga susunan acara yang kami buat agar tidak membosankan. Tentunya semangatku juga karena ada dia yang menemani. Namun, bukan hanya kejadian suka yang aku alami. Justru pertengkaran hebat kami berawal dari sebuah proposal. Mungkin karena rasa egoisku yang sering aku tonjolkan membuat dirinya geram hingga sempat memarahiku.