adspace: 30c3-countdown-banner
This commit is contained in:
parent
ecadb9fc9a
commit
bfa9b0f147
Binary file not shown.
After Width: | Height: | Size: 104 KiB |
|
@ -0,0 +1,31 @@
|
||||||
|
/**
|
||||||
|
* Original: https://github.com/trailblazr/30c3-countdown-banner-180x270/blob/master/30c3.html
|
||||||
|
* Heavily Modified
|
||||||
|
**/
|
||||||
|
$(document).ready(function() {
|
||||||
|
var el = $("<a class='countdown' href='https://events.ccc.de/congress/2013/' title='Click to get teleported to the 30C3 chaos wiki ...'><div class='countdownLine' style='margin-top:70px;'><div class='countdownElement'><span class='days'>0</span><span class='foo'>d </span></div><div class='countdownElement'><span class='hours'>0</span><span class='foo'>h </span></div><div class='countdownElement'><span class='minutes'>0</span><span class='foo'>m </span></div><div class='countdownElement'><span class='seconds'>0</span><span class='foo'>s</span></div></div></a>");
|
||||||
|
|
||||||
|
var padLeft = function(n, l, p) {
|
||||||
|
n = "" + n;
|
||||||
|
while(n.length < l)
|
||||||
|
n = p + n;
|
||||||
|
return n;
|
||||||
|
};
|
||||||
|
var target = new Date("2013-12-27T10:00:00+01:00").getTime();
|
||||||
|
var updateCountDown = function() {
|
||||||
|
var now = new Date().getTime();
|
||||||
|
var left = (target - now) / 1000;
|
||||||
|
|
||||||
|
var setField = function(id, val) {
|
||||||
|
el.find(id).text(padLeft(val, 2, "0"));
|
||||||
|
};
|
||||||
|
setField('.days', Math.floor(left / 86400));
|
||||||
|
setField('.hours', Math.floor(left / 3600) % 24);
|
||||||
|
setField('.minutes', Math.floor(left / 60) % 60);
|
||||||
|
setField('.seconds', Math.floor(left) % 60);
|
||||||
|
}
|
||||||
|
|
||||||
|
setInterval(updateCountDown, 1000);
|
||||||
|
updateCountDown();
|
||||||
|
$('#adspace').empty().append(el);
|
||||||
|
});
|
|
@ -787,3 +787,35 @@ article,aside,details,figcaption,figure,
|
||||||
footer,header,hgroup,menu,nav,section {
|
footer,header,hgroup,menu,nav,section {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* -- 30c3-countdown -- */
|
||||||
|
.countdown {
|
||||||
|
display: block;
|
||||||
|
width:180px;
|
||||||
|
height:270px;
|
||||||
|
background-image: url('../images/30c3_propaganda_180x270.png');
|
||||||
|
background-size:100%;
|
||||||
|
background-repeat:no-repeat;
|
||||||
|
max-width:180px;
|
||||||
|
margin:auto;
|
||||||
|
text-align: center;
|
||||||
|
color:white !important;
|
||||||
|
font-family:'Source Sans Pro',monospace,Helvetica,Arial,Sans-Serif;
|
||||||
|
font-size:22px;
|
||||||
|
font-weight:300;
|
||||||
|
-moz-border-radius: 5px;
|
||||||
|
-webkit-border-radius: 5px;
|
||||||
|
-khtml-border-radius: 5px;
|
||||||
|
border-radius: 5px;
|
||||||
|
padding:7px;
|
||||||
|
border:none;
|
||||||
|
}
|
||||||
|
.countdown .countdownElement {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
.countdown .foo {
|
||||||
|
color:white;
|
||||||
|
font-size:8px;
|
||||||
|
font-weight: 100;
|
||||||
|
white-space: pre;
|
||||||
|
}
|
||||||
|
|
|
@ -62,6 +62,9 @@
|
||||||
<xsl:call-template name="make-script-tag">
|
<xsl:call-template name="make-script-tag">
|
||||||
<xsl:with-param name="name" select="'bitlove-enclosures'"/>
|
<xsl:with-param name="name" select="'bitlove-enclosures'"/>
|
||||||
</xsl:call-template>
|
</xsl:call-template>
|
||||||
|
<xsl:call-template name="make-script-tag">
|
||||||
|
<xsl:with-param name="name" select="'30c3-countdown-banner'"/>
|
||||||
|
</xsl:call-template>
|
||||||
|
|
||||||
</xsl:template>
|
</xsl:template>
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue