For world peace, liberate Al-Aqsa, eliminate Israel and anyone who is with Israel, they are the real terrorists
Bacakan

Cara memperbesar ukuran text saat di klik secara otomatis

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



Klik


About the Author

Keindahanmu akan kuabadikan disetiap karyaku.

Post a Comment

Cookie Consent
We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.
AdBlock Detected!
We have detected that you are using adblocking plugin in your browser.
The revenue we earn by the advertisements is used to manage this website, we request you to whitelist our website in your adblocking plugin.
Site is Blocked
Sorry! This site is not available in your country.