Alter Tor Splash auf Tumblr

Question

Ich versuche dieses Skript http://codepen.io/blixxurd/pen/PZQVMy zu einer Tumblr-Seite hinzuzufügen und hatte kein Glück, die Schaltflächen funktionieren zu lassen.

Sieht gut aus, zeigt sich beim Laden der Seite, aber das Klicken auf die Schaltflächen scheint nichts zu tun. Jeder Rat wäre großartig. Hier

ist die javascript:

document.addEventListener("DOMContentLoaded", function(event) { 

    var cookieHandlers = { 

    createCookie : function(name,value,days) { 
     if (days) { 
      var date = new Date(); 
      date.setTime(date.getTime()+(days*24*60*60*1000)); 
      var expires = "; expires="+date.toGMTString(); 
     } 
     else var expires = ""; 
     document.cookie = name+"="+value+expires+"; path=/"; 
    }, 

    readCookie : function(name) { 
     var nameEQ = name + "="; 
     var ca = document.cookie.split(';'); 
     for(var i=0;i < ca.length;i++) { 
      var c = ca[i]; 
      while (c.charAt(0)==' ') c = c.substring(1,c.length); 
      if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); 
     } 
     return null; 
    }, 

    eraseCookie : function(name) { 
     cookieHandlers.createCookie(name,"",-1); 
    } 
    }; 

    var ageGate = { 
    element : document.getElementById("ageGate"), 
    sorryWarning : document.getElementById("ageSorryWarning"), 
    contentWrap : document.getElementById("ageContentWrap"), 
    cookieName : "forever21_or_older", 
    select : function(e) { 
     if(e=="yes") { 
     cookieHandlers.createCookie(ageGate.cookieName, "true", 30); 
     ageGate.actions.hide(); 
     } else { 
     ageGate.contentWrap.style.display = "none"; 
     ageGate.sorryWarning.style.display = "block"; 
     } 
    }, 
    actions : { 
     show : function() { 
     ageGate.element.style.display = "block"; 
     }, 
     hide : function() { 
     ageGate.element.style.display = "none"; 
     } 
    } 
    }; 

    //Pop Age Gate on Page Load 
    if(cookieHandlers.readCookie(ageGate.cookieName)==null) { 
    ageGate.actions.show(); 
    } 

}); 

Hier ist der HTML:

<div id="ageGate"> 
    <div class="age-content-wrapper" id="ageSorryWarning"> 
    <strong>Sorry, you must be 21 years of age or older to view this site.</strong><br><br> 
    <a class="btn btn-primary" href="http://google.com/">Leave Website</a> 
    </div> 
    <div class="age-content-wrapper" id="ageContentWrap"> 
    <strong class="age-heading">Are you at least 21 years old?</strong> 
    <div class="age-controls"> 
     <a href="javascript:;" onclick="ageGate.select('yes')" class="btn btn-large btn-success">Yes</a> 
     <a href="javascript:;" onclick="ageGate.select('no')" class="btn btn-large btn-danger">No</a> 
    </div> 
    <span class="age-subhead">This website facilitates the sale of alcoholic beverages. We use cookies to assist in verifying age.</span> 
    </div> 
</div> 

Answer 1

Hier ist das Update:

var cookieHandlers = { 

    createCookie : function(name,value,days) { 
     if (days) { 
      var date = new Date(); 
      date.setTime(date.getTime()+(days*24*60*60*1000)); 
      var expires = "; expires="+date.toGMTString(); 
     } 
     else var expires = ""; 
     document.cookie = name+"="+value+expires+"; path=/"; 
    }, 

    readCookie : function(name) { 
     var nameEQ = name + "="; 
     var ca = document.cookie.split(';'); 
     for(var i=0;i < ca.length;i++) { 
      var c = ca[i]; 
      while (c.charAt(0)==' ') c = c.substring(1,c.length); 
      if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); 
     } 
     return null; 
    }, 

    eraseCookie : function(name) { 
     cookieHandlers.createCookie(name,"",-1); 
    } 
    }; 

    var ageGate = { 
    element : null, 
    sorryWarning : null, 
    contentWrap : null, 
    cookieName : "forever21_or_older", 
    select : function(e) { 
     if(e=="yes") { 
     cookieHandlers.createCookie(ageGate.cookieName, "true", 30); 
     ageGate.actions.hide(); 
     } else { 
     ageGate.contentWrap.style.display = "none"; 
     ageGate.sorryWarning.style.display = "block"; 
     } 
    }, 
    actions : { 
     show : function() { 
     ageGate.element.style.display = "block"; 
     }, 
     hide : function() { 
     ageGate.element.style.display = "none"; 
     } 
    } 
    }; 


document.addEventListener("DOMContentLoaded", function(event) { 
    ageGate.element = document.getElementById("ageGate"); 
    ageGate.sorryWarning = document.getElementById("ageSorryWarning"); 
    ageGate.contentWrap = document.getElementById("ageContentWrap"); 

    //Pop Age Gate on Page Load 
    if(cookieHandlers.readCookie(ageGate.cookieName)==null) { 
    ageGate.actions.show(); 
    } 

});