LouisWhit
11/13/2018 - 7:43 PM

Delayed Popup / Conversion Form

After 10 seconds on the page the following popup will appear to prompt the visitor to a special offer. This offer may include a conversion form.

    $(document).ready(function() {
      function read_cookie(k,r){return(r=RegExp('(^|; )'+encodeURIComponent(k)+'=([^;]*)').exec(document.cookie))?r[2]:null;}
      var contactConsent = read_cookie('contactConsent');
      if (contactConsent === "1") {
          //They already clicked on the popup.
      } else if (contactConsent === "0"){
          //They didn't like the last popup.
      } else {
        $('#contactConsent').delay('10000').slideDown();
        $("#contactConsentAccept").on('click', function(event) {
          event.preventDefault();
          document.cookie = "contactConsent=1;path=/";
          console.log('accepted');
          //location.reload();
        });
        $("#contentConsentDecline i").on('click', function(event) {
          event.preventDefault();
          javascript:new function(){var c=document.cookie.split(";");
            for(var i=0;i<c.length;i++){
                var e=c[i].indexOf("=");
                var n=e>-1?c[i].substr(0,e):c[i];
                document.cookie=n+"=;expires=Thu, 01 Jan 1970 00:00:00 GMT";
            }
            document.cookie = "contactConsent=0;path=/";
            $("#contactConsent").slideUp();
          }(); return void(0);
        });
      };
  });
  <div id="contactConsent" style="display: none;">
    <div id="contentConsentDecline"><i class="fa fa-close"></i></div>
    <h3>Special Offer!</h3>
    <p>Get a free pre-visit consultation. Our team would love to hear about your dental priorities.</p>
    <iframe height="415"
        allowTransparency="true"
        frameborder="0"
        scrolling="auto"
        style="width:100%;border:none;overflow: scroll;"
        src="https://fremauxdental.wufoo.com/embed/w1gqqj4w0gt2z1t/">
    </iframe>
  </div> 


/* ContactConsent - Popup Conversion System
  ============================================== */
  #contactConsent{
    position: fixed;
    width: 320px;
    background-color:#fff;
    border:1px solid #5555;
    bottom: -2px;
    left: 15px;
    padding:20px;
    z-index: 99999999;
    box-shadow: 2px 8px 30px #888;
  }
  #contactConsent #contentConsentDecline{
    position: absolute;
    top: -15px;
    right: -15px;
    border:1px solid black;
    border-radius: 25px;
    background-color:#fff;
    width:25px;
    height:25px;
  }
  #contactConsent #contentConsentDecline i{
    font-size:12px;
    cursor: pointer;
    position: absolute;
    left:7px;
    top:6px;
  }
  #contactConsent h3{
    display: block;
    text-align: center;
    font-size:80%;
  }
  #contactConsent p{
    display: block;
    text-align: center;
    font-size: 80%;
  }
  #contactConsent iframe{}
  /* Xtra Small Devices (phone, 768px and below) */
  @media (max-width: 425px) {
    #contactConsent{
      display: none !important;
    }
  }

/* ============================================= */