Skip to content

Instantly share code, notes, and snippets.

@cassioeskelsen

cassioeskelsen/snippet.html

Forked from tristen/snippet.html
Created April 16, 2012 19:38
Show Gist options
  • Save cassioeskelsen/2400998 to your computer and use it in GitHub Desktop.
Save cassioeskelsen/2400998 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
snippet.html
<div id="wax-legend-census">
<a href="http://www.npr.org"><img src='data:image/png;base64,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' /></a>
<a class='show-embed' href="javascript:void(0)" onclick="showLegend();"> &#x2630; show legend</a>
<a href='http://npr.org/censusmap' class='gotosite'>visit npr.org/censusmap</a>
</div>
<div id="wax-legend-content" style="display:none;">
<a href="javascript:void(0)" onclick="removeLegend();" id='closebutton'>&#x2716;</a>
<script type="text/javascript">
window.onload = function() {
if (location.host === 'www.npr.org') {
document.getElementById('wax-legend-census').style.display='none';
document.getElementById('closebutton').style.display='none';
document.getElementById('wax-legend-content').style.display='block';
}
}
function showLegend(){
if (location.host != 'www.npr.org') {
document.getElementById('wax-legend-content').style.display='block';
document.getElementById('wax-legend-census').style.display='none';
}
}
function removeLegend(){
if (location.host != 'www.npr.org') {
document.getElementById('wax-legend-content').style.display='none';
document.getElementById('wax-legend-census').style.display='block';
}
}
</script>
<div class="census-legend">
<div class="census-title">Percent Population Change (2000-2010)</div>
<div class="census-scale">
<ul class="census-labels">
<li><span style="background:#935E9C;"></span><-20%</li>
<li><span style="background:#B9A1C7;"></span>-20%</li>
<li><span style="background:#E2D4E2;"></span>-10%</li>
<li><span style="background:#ECECEC;"></span>+10%</li>
<li><span style="background:#D7E7D3;"></span>+20%</li>
<li><span style="background:#98C595;"></span>+30%</li>
<li><span style="background:#519265;"></span>>+30%</li>
</ul>
</div>
<div class='census-source'>
Source
<a href='http://www.census.gov'>U.S. Census Bureau</a>,
<a href='http://www.ire.org/census/'>IRE</a>
</div>
<a href='http://npr.org/censusmap' class='gotosite'>visit npr.org/censusmap</a>
</div>
<style type="text/css">
.wax-legend {
font: normal 13px/20px Arial,sans-serif;
border: 1px solid #b3b3b3;
background: #fff;
overflow:hidden!important;
max-width: 280px!important;
height: 90px!important;
padding: 4px 9px;
position: relative;
}
#wax-legend-content a,
#wax-legend-census a {
text-decoration: none;
}
#wax-legend-census img {
margin: -4px -9px;
}
#wax-legend-census .show-embed {
display: block;
margin-top: 5px;
color: #7F8A8C;
height: 18px;
line-height: 18px;
}
.wax-legend .census-title {
text-align: left;
margin-bottom: 4px;
font-weight: bold;
font-size: 11px;
}
.wax-legend .census-scale ul {
margin: 0;
padding: 0;
float: left;
list-style: none;
}
.wax-legend .census-scale ul li {
display: block;
float: left;
width: 40px;
margin-bottom: 5px;
text-align: center;
font-size: 10px;
list-style: none;
}
.wax-legend ul.census-labels li span {
height: 12px;
width: 40px;
}
.wax-legend ul li span {
display: block;
float: left;
}
.wax-legend .census-source {
font-size: 8px;
clear: both;
text-transform: uppercase;
color: #b3b3b3;
}
a.gotosite{
position: absolute;
bottom: 7px;
right: 9px;
color: #282828;
font-size: 11px;
}
.wax-legend .census-source a{
color: #282828;
}
#closebutton {
float: right;
color: #000;
}
</style>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment