Hu?ng d?n t?o h?p download c� th?i gian d?m ngu?c

Button download chuy?n link u, b�nh thu?ng qu�. H�y s? d?ng h?p download c� th?i gian d?m ngu?c n�y, n� v?a l�m blog c?a b?n tr? n�n chuy�n nghi?p hon, v?a gi? ch�n ngu?i d�ng l�u hon.

C�ch th?c hi?n

Bu?c 1: ch�n do?n js n�y tru?c th? d�ng body

<script type='text/javascript'>

//<![CDATA[

function generate(){var e,n=document.getElementById("downloadx"),t=document.getElementById("btnx"),a=document.getElementById("downloadx").href,l=30,d=document.createElement("span");n.parentNode.replaceChild(d,n),e=setInterval(function(){--l<0?(d.parentNode.replaceChild(n,d),clearInterval(e),window.location.replace(a),n.style.display="inline"):(d.innerHTML="<p style='font-family:Google Sans, sans-serif'>Vui l�ng ch? "+l.toString()+" seconds...</p>",t.style.display="none")},1e3)}
//]]>

</script>

B?n d? � do?n l=30 c� nghia l� 30s, b?n ch?nh s?a l?i s? gi�y t�y �.

Bu?c 2: ch�n css

#btnx{cursor:pointer;padding:10px 20px;border:0;border-radius:3px;background:#007fff;color:#eeeeee;float:right;text-transform:capitalize;font-weight:500;transition:all 0.5s;font-size:15px}

#btnx:hover,#downloadx:hover{background:#222222;color:#eeeeee;outline:none}

.download_now{display:block;margin:0 auto;border-radius:4px}

.download-now{background-image:url('');color:#cccccc;padding:15px;display:block;background-size:480px;background-blend-mode:exclusion;background-color:#111111}
.download-title{color:#fff;display:inline-block;font-size:1.2em;line-height:38px;text-align:left}

.file-info{padding:15px;background:#cccccc;color:#222;font-size:14px}

#downloadx{float:right}

#downloadx{padding:10px 20px;border-radius:3px;background:#ffc832;text-decoration:none;color:#222;float:right;text-align:center;font-size:15px;text-transform:capitalize;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}

.download_button span{display:inline-block;line-height:38px;float:right}

.file-description{display:block}

.file-description span{font-size:12px}

Bu?c 3: Chuy?n sang tab HTMl trong khi vi?t b�i v� ch�n do?n code du?i n�y

<div class="download_now">

  <div class="download-now">

    <div class="download_button">

    <div class="download-title">Download free</div>

    <button onclick="generate()" id="btnx"><i class="fas fa-cloud-download-alt"></i> Download</button>

    <a id="downloadx" href="#" style="display:none"><i class="fas fa-cloud-download-alt"></i> Get Link</a>

    </div>

    <div class="file-description">

        <span class="file-size"> <i class="fa fa-file fa-fw" aria-hidden="true"></i> <strong>File Type:</strong> 130KB ZIP File</span>

    </div>

  </div>

  <div class="file-info"><i class="fas fa-info-circle"></i> Kh�i R�m Blog V5.0

  </div>

</div>

Nh? ch?nh s?a cho ph� h?p nh�!