Auto Select atau Seleksi Otomatis Pada Tag Pre dan BlockQuote

Auto Select atau Seleksi Otomatis Pada Tag Pre dan Blockquote ~ Kembali lagi dengan saya admin Lostcips yang pastinya tidak jauh-jauh share tentang tutorial blog. Pada kesempatan kali saya akan membagikan tutorial yang saya ketahui di blog Kang Ismet. Blog tersebut merupakan inspirasi blog saya dari beberapa inspirasi blog, blog Kang Ismet merupakan blog terfavorit saya, kenapa terfavorit? Karna blog tersebut membagikan tutorial disain, tips, maupun template blog yang bisa kita ketahui secara gratis.

Fungsi dari Auto Select atau Seleksi Otimatis yaitu agar memudahkan pengguna atau pengunjung untuk mem-block tulisan yang dia mau COPY (Copy Paste).  Untuk tutorialnya tidak sebanyak yang Anda pikirkan, dengan meletakkan dua perintah kode dibawah ini, dan Auto Select-pun bekerja dengan sempurna.

Seleksi Otomatis atau Auto Select Pada Tag Pre Menggunakan CSS

Langkah pertama :

Login ke Blogger > Tema > Edit HTML. Lalu copy kode dibawah ini di atas kode </style> atau ]]></b:skin>

.highlight { 

  -webkit-user-select: all;

  -moz-user-select: all;

  -ms-user-select: all;

  user-select: all;

}

Langkah kedua :

Untuk penerapannya Anda bisa COPAS kode dibawah ini kedalam mode HTML

<pre class='highlight'><code>$(document).ready(function() {

    $('.hilang').click(function() {

        $('#target').hide('fast');

    });

    $('.muncul').click(function() {

        $('#target').show('slow');

    });

});

</code></pre>

Langkah selanjutnya adalah Save.

Seleksi Otomatis atau Auto Select Pada Tag Blockquote Menggunakan JavaScript

Langkah pertama :

Copy kode dibawah ini diatas kode </body>

<script type='text/javascript'>

var pres = document.getElementsByTagName(&quot;blockquote&quot;);

for (var i = 0; i &lt; pres.length; i++) {

  pres[i].addEventListener(&quot;dblclick&quot;, function () {

    var selection = getSelection();

    var range = document.createRange();

    range.selectNodeContents(this);

    selection.removeAllRanges();

    selection.addRange(range);

  }, false);

}

</script>

Script diatas berlaku di Tag apapun, apabila Anda ingin menerapkannya di Tag Pre, maka ganti blockquote pada tulisan diberikan background menjadi pre
Langkah selanjutnya Save, dan lihat hasilnya

Sekian tutorial yang bisa saya berikan hari ini, semoga bermanfaat bagi Anda semua. Terimakasih telah berkunjung semoga Anda betah di blog saya, jangan lupa untuk Like dan Share kepada teman-teman Anda semua.