Thursday, 17 December 2015

Memasang Pre Code Double Klik

Ok Sob Kembali Lgi Bersama Saya Saya akan MemBahas Memasang Precode Double Klik Kode Tersebut Hampir Sama Dengan PRIM SYNTAX HIGHLIGHTER ... thumbnail 1 summary
Ok Sob Kembali Lgi Bersama Saya
Saya akan MemBahas Memasang Precode Double Klik
Kode Tersebut Hampir Sama Dengan PRIM SYNTAX HIGHLIGHTER

Ok Langsung DI SImak Berikut

1.Pasang Kode di bawah ini Dan Taruh Di atas Tepat Di atas ]]></b:skin>

 /* CSS Simple Pre Code */
pre {
    background: #696969;
    white-space: pre;
    word-wrap: break-word;
    overflow: auto;
}

pre.code {
    margin: 20px 25px;
    border: 1px solid #d9d9d9;
    border-radius: 2px;
    position: relative;
    box-shadow: 0 1px 1px rgba(0,0,0,.08);
}

pre.code label {
    font-family: sans-serif;
    font-weight: normal;
    font-size: 13px;
    color: #444;
    position: absolute;
    left: 1px;
    top: 16px;
    text-align: center;
    width: 60px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    pointer-events: none;
}

pre.code code {
    font-family: "Inconsolata","Monaco","Consolas","Andale Mono","Bitstream Vera Sans Mono","Courier New",Courier,monospace;
    display: block;
    margin: 0 0 0 60px;
    padding: 15px 16px 14px;
    border-left: 1px solid #d9d9d9;
    overflow-x: auto;
    font-size: 13px;
    line-height: 19px;
    color: #444;
}

pre::after {
    content: "double click to selection";
    padding: 0;
    width: auto;
    height: auto;
    position: absolute;
    right: 18px;
    top: 14px;
    font-size: 12px;
    color: #aaa;
    line-height: 20px;
    overflow: hidden;
    -webkit-backface-visibility: hidden;
    transition: all 0.3s ease;
}

pre:hover::after {
    opacity: 0;
    visibility: visible;
}

pre.code-css code {
    color: #0000CD;
}

pre.code-html code {
    color: #7CFC00;
}

pre.code-javascript code {
    color: #FFFF00;
}

pre.code-jquery code {
    color: #FF0000;
}

Berikutnya COpy Script Di bawah Ini Dan Paste Di Atas </body>


   <script type='text/javascript'> //<![CDATA[ //Pre Auto Selection $('i[rel="pre"]').replaceWith(function() {     return $('<pre><code>' + $(this).html() + '</code></pre>'); }); var pres = document.querySelectorAll('pre,kbd,blockquote'); 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>

Script Diatas Berfungsi Untuk Klik Dua Kali Pada Area Yang Ada Di atas

Dan Simpan Template
Untuk Penerapat Posting Silahkan Simpan Kode ini Di HTML

 <pre><code>...-kode HTML, CSS, JavaSript di Sini-..</code></pre>

 

    



Ok MAKASIH MUNGKIN INI SAJA YANG SAYA KETAHUI

No comments

Post a Comment

'; /* * * DON'T EDIT BELOW THIS LINE * * */ (function() { var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true; dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js'; (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); })(); '; // required: replace example with your forum shortname /* * * DON'T EDIT BELOW THIS LINE * * */ (function () { var s = document.createElement('script'); s.async = true; s.type = 'text/javascript'; s.src = '//' + disqus_shortname + '.disqus.com/count.js'; (document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s); }());