Copy code from a code box to Clipboard

<style type='text/css'> .tncodebox{padding-top:11px;position:relative;border: 1px solid #ddd;margin: 10px 0;} #resultcopied{position:fixed;top:30%;left:45%;z-index:2;background:#00ad62;color:#fff;padding:10px} .tnbtn{position:absolute;top:0;right:0;padding:2px 5px;;border-style:none;border-radius:2px;cursor:pointer;outline:none} .resultshow{-o-transition:opacity .5s;-moz-transition:opacity .5s;-webkit-transition:opacity .5s;transition:opacity .5s;opacity:1} .resulthide{opacity:0} pre{overflow:auto;max-height: 400px;margin-top:15px;border-top: 1px solid #ddd;background:#eee;} pre,code {font-family: consolas,Monaco,'Andale Mono',monospace;} code {background: #eee;padding: 2px 6px;} </style> <div class='widget Blog' data-version='1' id='Blog1'> <pre><code>&lt;b:if cond='data:view.isSingleItem'&gt; &lt;script type='text/javascript'&gt; //&lt;![CDATA[ var y = document.getElementById("Blog1").getElementsByTagName("img");for (var i = 0; i &lt; y.length;i++) {y[i].setAttribute("alt",document.title);y[i].setAttribute("title",document.title);}; //]]&gt; &lt;/script&gt; &lt;/b:if&gt; </code></pre> <b>Note:</b><br /> 1. No require <b>Jquery</b> library<br /> 2. Put that code before <code>&lt;/body&gt;</code> </div> <script> //<![CDATA[ var str=document.body.innerHTML;document.body.innerHTML=str.replace(/(\<pre\>)/gi,"<div class='tncodebox'><pre class='tncode'>").replace(/(\<\/pre\>)/gi,"$1<span class='tnbtn'>Copy</span></div>");var list=document.getElementsByClassName("tncode");for(var i=0;i<list.length;i++){list[i].id="box"+(i+1)}var list2=document.getElementsByClassName("tnbtn");for(var j=0;j<list.length;j++){list2[j].id="display(simplecopy(document.getElementById('box"+(j+1)+"').innerHTML));blogazwin()"}var str2=document.body.innerHTML;document.body.innerHTML=str2.replace(/span\sclass\=\"tnbtn\"\sid/gi,"span class='tnbtn' onclick");var simplecopy=function(){var d=document,b,cs,ss,f=false,n=d.createElement("DIV"),s=n.style;s.position="fixed";s.color="rgba(0,0,0,0)";function sc(t){if(!b){b=d.body};n.innerHTML=t;b.appendChild(n);ss=x(n);cs=d.execCommand("copy",f,null);b.removeChild(n);return ss&&cs};function x(n){var r,s,w=window.getSelection,c=b.createTextRange;if(c){r=c();r.moveToElementText(n);r.select();return!f}else if(w){s=w();r=d.createRange();r.selectNodeContents(n);s.removeAllRanges();s.addRange(r);return!f}else{return f}}return sc}();function display(result){};var result11div=document.createElement('div');result11div.id='resultcopied';result11div.className='resulthide';document.getElementsByTagName('body')[0].appendChild(result11div);result11div.innerHTML="Copied!";function blogazwin(){var div2=document.getElementById("resultcopied");div2.className="resultshow";setTimeout(function(){div2.className='resulthide'},500)}; //]]> </script>

​x

 

​

<style type='text/css'>

.tncodebox{padding-top:11px;position:relative;border: 1px solid #ddd;margin: 10px 0;}

#resultcopied{position:fixed;top:30%;left:45%;z-index:2;background:#00ad62;color:#fff;padding:10px}

.tnbtn{position:absolute;top:0;right:0;padding:2px 5px;;border-style:none;border-radius:2px;cursor:pointer;outline:none}

.resultshow{-o-transition:opacity .5s;-moz-transition:opacity .5s;-webkit-transition:opacity .5s;transition:opacity .5s;opacity:1}

.resulthide{opacity:0}

pre{overflow:auto;max-height: 400px;margin-top:15px;border-top: 1px solid #ddd;background:#eee;}

pre,code {font-family: consolas,Monaco,'Andale Mono',monospace;}

code {background: #eee;padding: 2px 6px;}

        </style>

<div class='widget Blog' data-version='1' id='Blog1'>

<pre><code>&lt;b:if cond='data:view.isSingleItem'&gt;

<script type='text/javascript'>

//<![CDATA[   

 var y = document.getElementById("Blog1").getElementsByTagName("img");for (var i = 0; i < y.length;i++) {y[i].setAttribute("alt",document.title);y[i].setAttribute("title",document.title);};

//]]>

</script>

</b:if>

</code></pre>

<b>Note:</b><br />

1. No require <b>Jquery</b> library<br />

2. Put that code before <code>&lt;/body&gt;</code>

</div>

​

<script>

//<![CDATA[ 

var str=document.body.innerHTML;document.body.innerHTML=str.replace(/(\<pre\>)/gi,"<div class='tncodebox'><pre class='tncode'>").replace(/(\<\/pre\>)/gi,"$1<span class='tnbtn'>Copy</span></div>");var list=document.getElementsByClassName("tncode");for(var i=0;i<list.length;i++){list[i].id="box"+(i+1)}var list2=document.getElementsByClassName("tnbtn");for(var j=0;j<list.length;j++){list2[j].id="display(simplecopy(document.getElementById('box"+(j+1)+"').innerHTML));blogazwin()"}var str2=document.body.innerHTML;document.body.innerHTML=str2.replace(/span\sclass\=\"tnbtn\"\sid/gi,"span class='tnbtn' onclick");var simplecopy=function(){var d=document,b,cs,ss,f=false,n=d.createElement("DIV"),s=n.style;s.position="fixed";s.color="rgba(0,0,0,0)";function sc(t){if(!b){b=d.body};n.innerHTML=t;b.appendChild(n);ss=x(n);cs=d.execCommand("copy",f,null);b.removeChild(n);return ss&&cs};function x(n){var r,s,w=window.getSelection,c=b.createTextRange;if(c){r=c();r.moveToElementText(n);r.select();return!f}else if(w){s=w();r=d.createRange();r.selectNodeContents(n);s.removeAllRanges();s.addRange(r);return!f}else{return f}}return sc}();function display(result){};var result11div=document.createElement('div');result11div.id='resultcopied';result11div.className='resulthide';document.getElementsByTagName('body')[0].appendChild(result11div);result11div.innerHTML="Copied!";function blogazwin(){var div2=document.getElementById("resultcopied");div2.className="resultshow";setTimeout(function(){div2.className='resulthide'},500)};

//]]>

</script>

​

​