Hello sobat icloudZer kali ini admin bakalan memberikan informasi mengenai bagaimana caranya Membuat sebuah text membesar ketika di klik di blogger
Info: Oke jika kamu sudah penasaran dengan pembahasan kita kali ini yuk langsung aja kita bahas secara bersama sama
Text Membesar
Apa itu text membesar? Text membesar merupakan suatu fitur ataupun tampilan ketika sebuah text disentuh maka akan mengubah tampilan text menjadi lebih besar dari text sebelumnya ketika belum disentuh, dan sebenarnya jika kamu sudah menguasai metode mengenai cara membuat text membesar ketika diklik ataupun disentuh ini, kamu bisa menerapkan cara yang sama kedalam tampilan yang berbeda semisal memperbesar svg ketika disentuh, memperbesar icon saat disentuh, atau memperbesar ukuran gambar saat disentuh, dan lain sebagainya, bukan terkhusus text saja
Dibuat menggunakan CSS
Untuk membuat tampilan text membesar saat di klik ataupun disentuh ini kita hanya membutuhkan kode CSS saja dalam pembuatannya, karena memang sesimple itu cara pembuatannya, tanpa ada penggunaan unsur kode javascript didalamnya kita sudah mampu untuk membuat text membesar ketika di sentuh tersebut
Properti transform
Dalam kode CSS terdapat beberapa penyebutan dalam setiap unit kode CSS semisal tag kode, class kode, properti, dan lain sebagainya! Nah khusus dalam pembahasan kita kali ini dalam membahas bagaimana caranya membuat text membesar ketika diklik tersebut kita membutuhkan penggunaan properti transform lebih tepatnya transform: scale(1.2), karena memang sebenarnya penggunaan properti transform itu banyak sekali penggunannya dalam kode CSS semisal text-transform, transform:translate(-160%,10%), dan sebagainya dengan penggunaan fungsi yang berbeda beda pastinya
Contoh Tampilan
Agar kamu tidak penasaran dengan bagaimana Tampilan dari text menjadi besar ketika diklik ini kamu bisa melihat contoh tampilan yang sudah admin sediakan, klik tombol dibawah ini untuk melihatnya
Info: Bagaimana sobat icloudZer dengan contoh tampilannya keren pastinya ya kan hahaha 🤪
Cara pembuatan
Baiklah sobat icloudZer sekarang saatnya admin bakalan menjabarkan mengenai bagaimana caranya membuat text membesar ketika diklik diblogger kamu bisa mempelajarinya dengan membaca artikel ini hingga selesai ok
Kode CSS
Langkah pertama yang bisa kamu lakukan untuk membuat text menjadi besar ketika diklik kamu bisa menyalin kode CSS dibawah ini, kemudian letakkan diatas kode ]]><b:skin>
.rahBigText{
color:inherit;
overflow:hidden;
font-size:normal;
font-weight:normal;
font-family:normal;
}
.rahBigText:hover{
transform: scale(1.2);
}Info: Atau kamu bisa menggunakan tag kode <style> untuk meletakkan kode CSS diatas
Cara penggunaan
Nah sekarang saatnya admin bakalan memberikan penjabaran mengenai bagaimana cara penggunaan dari kode CSS diatas, kamu bisa langsung menyalin kode HTML dibawah ini kemudian kamu bisa letakkan atau gunakan saat ingin menampilkan text yang bisa membesar saat diklik tersebut
<div class="rahBigText">
<!-- Tuliskan textnya disini semisal, Admin tamfan hahaha -->
</div>Info: Jika masih bingung gunakan kode HTML diatas saat kamu ingin menampilkan text tersebut semisal, didalam artikel atupun source kode template didalam menu Edit HTML