Cara Membuat Tombol HTML Tag "kbd" dengan Efek Double click to select - Pada kesempatan kali ini aku akan membuatkan tutorial Bagaimana Cara Membuat Selection HTML Tag kbd dengan Efek Double click to select, ini dipakai untuk memepermudal melaksanakan select semoga tidak susah mengklik sebuah kode, dan lebih manis di lihat dan tutorial ini cukup membantu pengunjung dalam melaksanakan copy past kode.
Elemen kbd merupakan abreviasi dari Keyboard. Dimana tag <kbd></kbd> dipakai untuk merepresentasikan masukkan dari user (berupa huruf dari keyboard atau dari alat lainnya ibarat perintah bunyi (voice command).
Baiklah semoga tidak banyak basi, mari kita mulai Tutorial Bagaimana Cara Membuat Selection HTML Tag kbd dengan Efek Double click to select ini, lihat dan pahami langkah-langkah berikut ini :
1. Buka Blogger - Login
2. Masuk ke Dasboard - Pilih Tema
3. Klik Edit Tema
Cara Kedua
1. Masuk ke Edit HTML
2. Lalu cari kode]]></b:skin> , Tekan CTRL + F untuk mempermudah mencari aba-aba semoga lebih cepat
3. Jika sudah sanggup aba-aba tersebut, kemudian copy p code dibawah ini dan paste diatas]]></b:skin>
4. Jika sudah kemudian masukan aba-aba JavaScript, Cari kode </body>, Jika sudah ketemu letakan aba-aba di bawah ini sempurna di atasnya kode</body>
5.Lalu simpan atau simpan template
Cara Terakhir
1. Buat Postingan Baru
2. Ada dua tombol Compose dan HTML
3. Pilih HTML
4. Lalu Copy Code dibawah ini
5. Save dan Lihat hasilnya
Demikian Tutorial Membuat HTML Tag kbd dengan Efek Double click to select Responsive , sangat gampang bukan. ? Semoga tutorial ini sanggup bermanfaat dan membantu anda, bila ada yang ingin di tayakan sanggup koment di bawah ini. Terima kasih.
Elemen kbd merupakan abreviasi dari Keyboard. Dimana tag <kbd></kbd> dipakai untuk merepresentasikan masukkan dari user (berupa huruf dari keyboard atau dari alat lainnya ibarat perintah bunyi (voice command).
Baiklah semoga tidak banyak basi, mari kita mulai Tutorial Bagaimana Cara Membuat Selection HTML Tag kbd dengan Efek Double click to select ini, lihat dan pahami langkah-langkah berikut ini :
Cara Membuat HTML Tag kbd dengan Efek Double click to select
Cara Pertama :1. Buka Blogger - Login
2. Masuk ke Dasboard - Pilih Tema
3. Klik Edit Tema
Cara Kedua
1. Masuk ke Edit HTML
2. Lalu cari kode]]></b:skin> , Tekan CTRL + F untuk mempermudah mencari aba-aba semoga lebih cepat
3. Jika sudah sanggup aba-aba tersebut, kemudian copy p code dibawah ini dan paste diatas]]></b:skin>
/* CSS FOR KBD by alponse */ kbd{position:relative;color:#28a1f0;-webkit-user-select:text;-khtml-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;} kbd:before{ position:absolute; content:'Double click to select'; display:table; bottom:23px; left:0; background:#4c4c4c; color:#fff; padding:4px; border-radius:2px; font-size:75%; line-height:1; opacity:0; visibility:hidden; transform:scale(0.8); z-index:2; transition:all .3s;} kbd:hover:before{transform:scale(1.0);opacity:1;visibility:visible;transition:all .3s} 4. Jika sudah kemudian masukan aba-aba JavaScript, Cari kode </body>, Jika sudah ketemu letakan aba-aba di bawah ini sempurna di atasnya kode</body>
<script type='text/j4vascript'> //<![CDATA[ //Pre Auto Selection var pres = document.querySelectorAll('kbd'); for (var i = 0; i < pres.length; i++) { pres[i].addEventListener("dblclick", function () { var selection = getSelection(); var range = document.createRange(); range.selectNodeContents(this); selection.removeAllRanges(); selection.addRange(range); }, false); } //]]> </script> 5.Lalu simpan atau simpan template
Cara Terakhir
1. Buat Postingan Baru
2. Ada dua tombol Compose dan HTML
3. Pilih HTML
4. Lalu Copy Code dibawah ini
<kbd>Masukan Disini</kbd> 5. Save dan Lihat hasilnya
Demikian Tutorial Membuat HTML Tag kbd dengan Efek Double click to select Responsive , sangat gampang bukan. ? Semoga tutorial ini sanggup bermanfaat dan membantu anda, bila ada yang ingin di tayakan sanggup koment di bawah ini. Terima kasih.
Sumber http://idalponse.blogspot.com
EmoticonEmoticon