“So fügen Sie Countdown -Timer -Sperre in Blogger hinzu” Code-Antworten

So fügen Sie Countdown -Timer -Sperre in Blogger hinzu

<div style="text-align: center;"><button class="button" id="Cnt-Timer-TD">Show Content</button> </div>
  <div id="element-show" target="_blank">
   
    <!-- Add your content here to show after the timer finish -->
This is a dummy text which shows after timer finishes. here your can add Buttons, text etc anything which you have to show after timer finish<p/> 
    <a class="button" href="" >Tutorial</a>

    
</div> 


    <script>/*<![CDATA[*/
var counter = 9; // Add time here in seconds 
var id,downloadButton=document.getElementById("element-show"),newElement=document.createElement("p");function startDownload(){this.style.display="none",id=setInterval(function(){counter--,counter<0?(newElement.parentNode.replaceChild(downloadButton,newElement),clearInterval(id)):newElement.innerHTML="<center><strong>Please wait <span>"+counter.toString()+"</span> seconds</strong><p/><Cnt-Timer><svg viewBox='0 0 40 50' x='0px' y='0px'><path d='M25.251,6.461c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615V6.461z'><animateTransform attributeName='transform' attributeType='xml' dur='0.6s' from='0 25 25' repeatCount='indefinite' to='360 25 25' type='rotate'></animateTransform></path></svg> Generating... Please Wait!</Cnt-Timer></center>"},1e3)}newElement.innerHTML="<span></span>",downloadButton.parentNode.replaceChild(newElement,downloadButton);var clickbtn=document.getElementById("Cnt-Timer-TD");clickbtn.onclick=startDownload;
 /*]]>*/ </script>


<style>
  Cnt-Timer{font-family:var(--fontB);font-size:13px;opacity:.8;display:inline-flex;align-items:center}
  button#Cnt-Timer-TD {
    display: inline-block;
    height: 31px;
    background-color: #00A3FE;
    font-family: var(--body-font);
    font-size: 14px;
    color: #ffffff;
    font-weight: 400;
    line-height: 31px;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    padding: 0 15px;
    margin: 0 5px 5px 0;
    border: 1px solid rgba(0,0,0,.1);
    border-bottom-width: 2px;
    border-radius: 2px;}
</style>