/* Light YouTube Embeds by @labnol */
/* Web: http://labnol.org/?p=27941 */
document.addEventListener(“DOMContentLoaded”,
function() {
var div, n,
v = document.getElementsByClassName(“youtube-player”);
for (n = 0; n < v.length; n++) {
div = document.createElement("div");
div.setAttribute("data-id", v[n].dataset.id);
div.innerHTML = labnolThumb(v[n].dataset.id);
div.onclick = labnolIframe;
v[n].appendChild(div);
}
});
function labnolThumb(id) {
var thumb = '

‘,
play = ‘
‘;
return thumb.replace(“ID”, id) + play;
}
function labnolIframe() {
var iframe = document.createElement(“iframe”);
var embed = “https://www.youtube.com/embed/ID?autoplay=1&modestbranding=1&rel=0”;
/* We set autoplay, removed YouTube logo, and no related end videos */
iframe.setAttribute(“src”, embed.replace(“ID”, this.dataset.id));
iframe.setAttribute(“frameborder”, “0”);
iframe.setAttribute(“allowfullscreen”, “1”);
this.parentNode.replaceChild(iframe, this);
}
.youtube-player {
position: relative;
padding-bottom: 56.23%;
/* Use 75% for 4:3 videos */
height: 0;
overflow: hidden;
max-width: 100%;
background: #000;
margin: 5px;
}
.youtube-player iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 100;
background: transparent;
}
.youtube-player img {
bottom: 0;
display: block;
left: 0;
margin: auto;
max-width: 100%;
width: 100%;
position: absolute;
right: 0;
top: 0;
border: none;
height: auto;
cursor: pointer;
-webkit-transition: .4s all;
-moz-transition: .4s all;
transition: .4s all;
}
.youtube-player img:hover {
-webkit-filter: brightness(75%);
}
.youtube-player .play {
rotate: 180deg;
height: 128px;
width: 128px;
left: 50%;
top: 50%;
margin-left: -64px;
margin-top: -64px;
position: absolute;
background: url(“//upload.wikimedia.org/wikipedia/commons/1/14/Glossy_3d_blue_arrowhead_left.png”) no-repeat;
cursor: pointer;
background-size: 100%;
}
Collecting overdue payments can be expensive and time consuming. An innocent reason for the card on file to fail is simply that it has expired. By automatically giving customers the opportunity to update a card, we can provide a better customer experience and lower operating costs.
This recipe is primarily intended for companies that sell using subscriptions or payment plans.