Kembali lagi bersama sahabat husen, kali ini kita akan membahas wacana cara menciptakan Double click to select memakai tag kbd pada blogger. Mungkin dari sebagian orang sudah mengetahui fungsi dari memakai tag <kbd> </kbd> ini. Bagi yang belum tahu sanggup di simak di artikel sahabat husen ini.
Fungsi dari Double Click To Select memakai isyarat <kbd> ini berfungsi untuk mempermudah pengunjung dalam melaksanakan copy & paste suatu kata atau kalimat yang penting. Contoh perkara penggunaan Double Click To Select.
Dengan cara double click to select </head> diatas pengunjung dengan gampang dengan cara klik kata tersebut dengan double klik maka secara otomatis kata ter-block dan pengunjung tinggal menekan CTRL+C untuk meng-copy kata penting tersebut. Baca juga Cara Membuat Kotak Script Dalam Halaman Postingan Blog
Terakhir masukan script pre auto selection dengan mencari kode </body> simpan di atas isyarat tersebut. copy & paste isyarat script dibawah ini.
Caranya sangat gampang sekali sahabat tinggal buka entri gres atau halaman baru, lalu masuk ke mode HTML kemudian ketikan isyarat berikut ini.
Hasil penulisan isyarat diatas akan menyerupai dibawah ini.
Begitulah Cara Membuat Double Click To Select Dalam Postingan Blog biar membantu dan bermanfaat bagi kalian. Wassalamualaikum. Sumber https://www.sobathusen.com/
Fungsi dari Double Click To Select memakai isyarat <kbd> ini berfungsi untuk mempermudah pengunjung dalam melaksanakan copy & paste suatu kata atau kalimat yang penting. Contoh perkara penggunaan Double Click To Select.
Kasus: Setelah masuk ke dalam halaman blogger.com selanjutnya masuk ke dashboard > Tema > Edit HTML lalu cari </head>
Dengan cara double click to select </head> diatas pengunjung dengan gampang dengan cara klik kata tersebut dengan double klik maka secara otomatis kata ter-block dan pengunjung tinggal menekan CTRL+C untuk meng-copy kata penting tersebut. Baca juga Cara Membuat Kotak Script Dalam Halaman Postingan Blog
Cara Membuat Double Click To Select Dalam Postingan Blog
# Langkah 1: Masukan Kode CSS KBD
Pertama sahabat harus login terlebih dahulu ke blogger.com kemdian masuk ke dashboard > Tema > Edit HTML.
Kemudian cari kode ]]></b:skin> atau </style> simpan isyarat tersebut di atasnya, copy & paste isyarat css untuk <kbd> dibawah ini.
# Langkah 2: Masukan Script Pre Auto SelectionKemudian cari kode ]]></b:skin> atau </style> simpan isyarat tersebut di atasnya, copy & paste isyarat css untuk <kbd> dibawah ini.
/* CSS KBD www.sobathusen.com */ kbd{position:relative;color:#47c0ba;-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}Catatan: Anda sanggup mengganti isyarat warna dan text yang telah di tandain di atas
- Kode #47c0ba mengganti warna teks yang ditandai <kbd>
- Tulisan Double click to select mengganti teks yang akan muncul ketikan kursor di arahkan
- Kode #4c4c4c mengganti background teks hover yang muncul <kbd>
- Size 75% mengganti ukuran text hover yang muncul <kbd>
Terakhir masukan script pre auto selection dengan mencari kode </body> simpan di atas isyarat tersebut. copy & paste isyarat script dibawah ini.
<script type='text/javascript'> //<![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>Cara Menggunakan Double Click To Select Dalam Postingan Blog
Caranya sangat gampang sekali sahabat tinggal buka entri gres atau halaman baru, lalu masuk ke mode HTML kemudian ketikan isyarat berikut ini.
<kbd>TULISAN ANDA DISINI ...!</kbd>Hasil penulisan isyarat diatas akan menyerupai dibawah ini.
TULISAN ANDA DISINI ...!
Begitulah Cara Membuat Double Click To Select Dalam Postingan Blog biar membantu dan bermanfaat bagi kalian. Wassalamualaikum. Sumber https://www.sobathusen.com/