tag list
by sambaldwin
HTML
<h2>Tags</h2>
<ul>
<li>Architectural Association School of Architecture</li>
<li>collaboration</li>
<li>Website design</li>
<li>Website development</li>
<li>WordPress</li>
</ul>
<h2>For</h2>
<p>Architectural Association School of Architecture, London (2013)
<p>
<h2>Designed at</h2>
<p>Sara De Bondt studio
<p>
CSS
* {
margin:0;
padding:0;
font-size:100%;
line-height:1.35em;
}
html {
font-size:16px;
}
body {
font-family:Helvetica Neue;
font-weight:500;
margin:1em;
color:#222;
width:14em;
background:#ddd;
}
ul {
margin:0 0 1em 1em;
}
li {
cursor:pointer;
list-style-type:none;
margin:0;
padding:0;
}
li.active:before {
content:"#";
display:inline-block;
width:0.7em;
margin-left:-0.7em;
}
li.active {
color:#222;
}
p {
margin:0 0 1em 1em;
}
h2 {
margin:0 0 0 1em;
font-weight:900;
}
JavaScript
$('li').hover(
function () {
$(this).addClass('active');
},
function () {
$(this).removeClass('active');
});