-
Notifications
You must be signed in to change notification settings - Fork 112
/
isotope.html
222 lines (171 loc) · 33.4 KB
/
isotope.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Filtrify - Isotope integration</title>
<meta name="description" content="Filtrify">
<meta name="keywords" content="javascript, jquery, filtering, filter, plugin" />
<meta name="author" content="Luís Almeida">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/sunburst.css">
<link rel="stylesheet" href="css/filtrify.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="js/highlight.pack.js"></script>
<script src="js/script.js"></script>
<script src="js/filtrify.min.js"></script>
<script src="js/jquery.isotope.min.js"></script>
<style>
/**** Isotope Filtering ****/
.isotope-item {
z-index: 2;
}
.isotope-hidden.isotope-item {
pointer-events: none;
z-index: 1;
}
/**** Isotope CSS3 transitions ****/
.isotope,
.isotope .isotope-item {
-webkit-transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
-ms-transition-duration: 0.8s;
-o-transition-duration: 0.8s;
transition-duration: 0.8s;
}
.isotope {
-webkit-transition-property: height, width;
-moz-transition-property: height, width;
-ms-transition-property: height, width;
-o-transition-property: height, width;
transition-property: height, width;
}
.isotope .isotope-item {
-webkit-transition-property: -webkit-transform, opacity;
-moz-transition-property: -moz-transform, opacity;
-ms-transition-property: -ms-transform, opacity;
-o-transition-property: top, left, opacity;
transition-property: transform, opacity;
}
/**** disabling Isotope CSS3 transitions ****/
.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
-webkit-transition-duration: 0s;
-moz-transition-duration: 0s;
-ms-transition-duration: 0s;
-o-transition-duration: 0s;
transition-duration: 0s;
}
</style>
<script type="text/javascript">
$(function() {
var container = $("#container");
container.isotope({
itemSelector : 'ul#container > li',
layoutMode : 'fitRows'
});
$.filtrify("container", "placeHolder", {
hide : false,
callback : function ( query, match, mismatch ) {
container.isotope({ filter : $(match) });
}
});
});
</script>
</head>
<body>
<!--[if lt IE 7]><p class=chromeframe>Your browser is <em>ancient!</em> <a href="http://browsehappy.com/">Upgrade to a different browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to experience this site.</p><![endif]-->
<div id="header" role="banner">
<h1><a href="http://luis-almeida.github.com/filtrify/">filtrify</a></h1>
<h2>Beautiful advanced tag filtering with HTML5 and jQuery</h2>
<p>by the same author of <a href="http://luis-almeida.github.com/jPages/">jPages</a>, <i>Luís Almeida</i></p>
<a href="https://twitter.com/lmgalmeida" class="twitter-follow-button" data-show-count="false">Follow @lmgalmeida</a>
<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://luis-almeida.github.com/filtrify/" data-text="Filtrify - Beautiful advanced tag filtering with HTML5 and jQuery" data-via="lmgalmeida" data-related="lmgalmeida">Tweet</a>
<iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fluis-almeida.github.com%2Ffiltrify%2F&send=false&layout=button_count&width=90&show_faces=false&action=like&colorscheme=light&font=arial&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:90px; height:21px;" allowTransparency="true"></iframe>
<!--<div class="g-plusone" data-size="medium" data-href="http://luis-almeida.github.com/filtrify/"></div>-->
</div>
<div id="main" role="main">
<div id="content" class="demo">
<h2>Single category</h2>
<p>We all know and love <a href="http://isotope.metafizzy.co/">Isotope</a> magical layouts. Amazing work by <a href="http://desandro.com/">David DeSandro</a> / <a href="http://metafizzy.co/">Metafizzy</a></p>
<p>You can easily integrate Isotope/Masonry with filtrify and get all of those sexy animations.</p>
<p>Download <a href="http://isotope.metafizzy.co/">isotope</a> and add it to the <head> section of your page.</p>
<p>Don't forget to add the styles to enable animation with CSS transitions.</p>
<pre class="show html"><code><div id="placeHolder"></div>
<ul id="container">
<li data-genre="rock, blues, classic rock, jazz"> ... B.B. King ... </li>
<li data-genre="pop, rock, alternative, indie, british, britpop"> ... Oasis ... </li>
<li data-genre="soul, rnb, jazz, female vocalists"> ... Erykah Badu ... </li>
<li data-genre="alternative, hip hop, soul, funk"> ... Gnarls Barkley ... </li>
<li data-genre="blues"> ... Howlin' Wolf ... </li>
...
</ul></code></pre>
<pre class="show javascript"><code>$(function() {
var container = $("#container");
container.isotope({
itemSelector : 'ul#container > li',
layoutMode : 'fitRows'
});
$.filtrify("container", "placeHolder", {
hide : false,
callback : function ( query, match, mismatch ) {
container.isotope({ filter : $(match) });
}
});
});</code></pre>
<pre class="show css"><code>/**** Isotope Filtering ****/
.isotope-item {
z-index: 2;
}
.isotope-hidden.isotope-item {
pointer-events: none;
z-index: 1;
}
/**** Isotope CSS3 transitions ****/
.isotope,
.isotope .isotope-item {
-webkit-transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
-ms-transition-duration: 0.8s;
-o-transition-duration: 0.8s;
transition-duration: 0.8s;
}
.isotope {
-webkit-transition-property: height, width;
-moz-transition-property: height, width;
-ms-transition-property: height, width;
-o-transition-property: height, width;
transition-property: height, width;
}
.isotope .isotope-item {
-webkit-transition-property: -webkit-transform, opacity;
-moz-transition-property: -moz-transform, opacity;
-ms-transition-property: -ms-transform, opacity;
-o-transition-property: top, left, opacity;
transition-property: transform, opacity;
}
/**** disabling Isotope CSS3 transitions ****/
.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
-webkit-transition-duration: 0s;
-moz-transition-duration: 0s;
-ms-transition-duration: 0s;
-o-transition-duration: 0s;
transition-duration: 0s;
}</code></pre>
<div id="placeHolder"></div>
<ul id="container"><li data-genre="rock, blues, classic rock, jazz"><strong>B.B. King</strong><img src="http://userserve-ak.last.fm/serve/126/2250381.jpg"><i>rock, blues, classic rock, jazz</i></li><li data-genre="pop, rock, alternative, indie, british, britpop"><strong>Oasis</strong><img src="http://userserve-ak.last.fm/serve/126/44937531.jpg"><i>pop, rock, alternative, indie, british, britpop</i></li><li data-genre="soul, rnb, jazz, female vocalists"><strong>Erykah Badu</strong><img src="http://userserve-ak.last.fm/serve/126/63635441.jpg"><i>soul, rnb, jazz, female vocalists</i></li><li data-genre="alternative, hip hop, soul, funk"><strong>Gnarls Barkley</strong><img src="http://userserve-ak.last.fm/serve/126/4230752.jpg"><i>alternative, hip hop, soul, funk</i></li><li data-genre="blues"><strong>Howlin' Wolf</strong><img src="http://userserve-ak.last.fm/serve/126/146448.jpg"><i>blues</i></li><li data-genre="electronic, house, dance"><strong>Swedish House Mafia</strong><img src="http://userserve-ak.last.fm/serve/126/62318733.jpg"><i>electronic, house, dance</i></li><li data-genre="electronic, dance"><strong>Justice</strong><img src="http://userserve-ak.last.fm/serve/126/4737547.jpg"><i>electronic, dance</i></li><li data-genre="disco, soul, funk"><strong>Kool & The Gang</strong><img src="http://userserve-ak.last.fm/serve/126/28273647.jpg"><i>disco, soul, funk</i></li><li data-genre="electronic, dance"><strong>The Chemical Brothers</strong><img src="http://userserve-ak.last.fm/serve/126/27347.jpg"><i>electronic, dance</i></li><li data-genre="pop, rock, alternative, indie, britpop"><strong>Placebo</strong><img src="http://userserve-ak.last.fm/serve/126/300983.jpg"><i>pop, rock, alternative, indie, britpop</i></li><li data-genre="pop, disco, funk, dance"><strong>KC And The Sunshine Band</strong><img src="http://userserve-ak.last.fm/serve/126/573905.jpg"><i>pop, disco, funk, dance</i></li><li data-genre="soul, blues, jazz, female vocalists"><strong>Aretha Franklin</strong><img src="http://userserve-ak.last.fm/serve/126/12028673.jpg"><i>soul, blues, jazz, female vocalists</i></li><li data-genre="rock, alternative, grunge"><strong>Stone Temple Pilots</strong><img src="http://userserve-ak.last.fm/serve/126/5304.jpg"><i>rock, alternative, grunge</i></li><li data-genre="rock, british, classic rock"><strong>The Who</strong><img src="http://userserve-ak.last.fm/serve/126/219747.jpg"><i>rock, british, classic rock</i></li><li data-genre="pop, electronic"><strong>Kraftwerk</strong><img src="http://userserve-ak.last.fm/serve/126/38312355.jpg"><i>pop, electronic</i></li><li data-genre="electronic"><strong>Aphex Twin</strong><img src="http://userserve-ak.last.fm/serve/126/43147103.png"><i>electronic</i></li><li data-genre="electronic, dance"><strong>Simian Mobile Disco</strong><img src="http://userserve-ak.last.fm/serve/126/4717990.jpg"><i>electronic, dance</i></li><li data-genre="rock, blues, classic rock"><strong>Stevie Ray Vaughan And Double Trouble</strong><img src="http://userserve-ak.last.fm/serve/126/3214973.jpg"><i>rock, blues, classic rock</i></li><li data-genre="rock, punk"><strong>Rancid</strong><img src="http://userserve-ak.last.fm/serve/126/204902.jpg"><i>rock, punk</i></li><li data-genre="rock, alternative, indie, british"><strong>Arctic Monkeys</strong><img src="http://userserve-ak.last.fm/serve/126/20216611.gif"><i>rock, alternative, indie, british</i></li><li data-genre="pop, disco, dance, female vocalists"><strong>Donna Summer</strong><img src="http://userserve-ak.last.fm/serve/126/5926835.jpg"><i>pop, disco, dance, female vocalists</i></li><li data-genre="pop, electronic, dance, female vocalists"><strong>Kylie Minogue</strong><img src="http://userserve-ak.last.fm/serve/126/48471679.png"><i>pop, electronic, dance, female vocalists</i></li><li data-genre="alternative, electronic"><strong>Moby</strong><img src="http://userserve-ak.last.fm/serve/126/130045.jpg"><i>alternative, electronic</i></li><li data-genre="rock, punk"><strong>NOFX</strong><img src="http://userserve-ak.last.fm/serve/126/847125.jpg"><i>rock, punk</i></li><li data-genre="electronic"><strong>Air</strong><img src="http://userserve-ak.last.fm/serve/126/282635.jpg"><i>electronic</i></li><li data-genre="hip hop, rnb"><strong>Kanye West</strong><img src="http://userserve-ak.last.fm/serve/126/9744105.jpg"><i>hip hop, rnb</i></li><li data-genre="hip hop, rnb"><strong>Chris Brown</strong><img src="http://userserve-ak.last.fm/serve/126/38928105.png"><i>hip hop, rnb</i></li><li data-genre="rock, classic rock"><strong>Queen</strong><img src="http://userserve-ak.last.fm/serve/126/3237752.jpg"><i>rock, classic rock</i></li><li data-genre="pop, soul, rnb"><strong>Usher</strong><img src="http://userserve-ak.last.fm/serve/126/33623371.png"><i>pop, soul, rnb</i></li><li data-genre="rock, alternative, grunge"><strong>Alice In Chains</strong><img src="http://userserve-ak.last.fm/serve/126/13328381.jpg"><i>rock, alternative, grunge</i></li><li data-genre="pop, disco, dance"><strong>Modern Talking</strong><img src="http://userserve-ak.last.fm/serve/126/34836957.gif"><i>pop, disco, dance</i></li><li data-genre="electronic, dance"><strong>Kavinsky</strong><img src="http://userserve-ak.last.fm/serve/126/19660845.png"><i>electronic, dance</i></li><li data-genre="rock, alternative, indie"><strong>The White Stripes</strong><img src="http://userserve-ak.last.fm/serve/126/23656729.jpg"><i>rock, alternative, indie</i></li><li data-genre="pop, disco"><strong>ABBA</strong><img src="http://userserve-ak.last.fm/serve/126/44442235.png"><i>pop, disco</i></li><li data-genre="pop, british, female vocalists, britpop"><strong>Lily Allen</strong><img src="http://userserve-ak.last.fm/serve/126/3476271.jpg"><i>pop, british, female vocalists, britpop</i></li><li data-genre="rock, alternative, funk"><strong>Red Hot Chili Peppers</strong><img src="http://userserve-ak.last.fm/serve/126/250600.jpg"><i>rock, alternative, funk</i></li><li data-genre="pop, soul, funk, dance"><strong>Michael Jackson</strong><img src="http://userserve-ak.last.fm/serve/126/25624835.jpg"><i>pop, soul, funk, dance</i></li><li data-genre="rock, alternative, grunge, female vocalists"><strong>Hole</strong><img src="http://userserve-ak.last.fm/serve/126/53038525.png"><i>rock, alternative, grunge, female vocalists</i></li><li data-genre="blues"><strong>Robert Johnson</strong><img src="http://userserve-ak.last.fm/serve/126/5189926.jpg"><i>blues</i></li><li data-genre="rock, metal"><strong>Slipknot</strong><img src="http://userserve-ak.last.fm/serve/126/7885573.jpg"><i>rock, metal</i></li><li data-genre="alternative, hip hop, soul"><strong>The Roots</strong><img src="http://userserve-ak.last.fm/serve/126/8526611.jpg"><i>alternative, hip hop, soul</i></li><li data-genre="hip hop, soul, funk"><strong>OutKast</strong><img src="http://userserve-ak.last.fm/serve/126/189912.jpg"><i>hip hop, soul, funk</i></li><li data-genre="rock, classic rock"><strong>The Doors</strong><img src="http://userserve-ak.last.fm/serve/126/17737529.jpg"><i>rock, classic rock</i></li><li data-genre="pop, soul, rnb, funk"><strong>Stevie Wonder</strong><img src="http://userserve-ak.last.fm/serve/126/133468.jpg"><i>pop, soul, rnb, funk</i></li><li data-genre="rock, alternative, grunge"><strong>The Smashing Pumpkins</strong><img src="http://userserve-ak.last.fm/serve/126/887234.jpg"><i>rock, alternative, grunge</i></li><li data-genre="blues, jazz"><strong>John Lee Hooker</strong><img src="http://userserve-ak.last.fm/serve/126/10987913.jpg"><i>blues, jazz</i></li><li data-genre="soul, funk"><strong>Parliament</strong><img src="http://userserve-ak.last.fm/serve/126/42607103.jpg"><i>soul, funk</i></li><li data-genre="rock, alternative, indie"><strong>Muse</strong><img src="http://userserve-ak.last.fm/serve/126/398895.jpg"><i>rock, alternative, indie</i></li><li data-genre="pop, soul, rnb, female vocalists"><strong>Alicia Keys</strong><img src="http://userserve-ak.last.fm/serve/126/68860744.png"><i>pop, soul, rnb, female vocalists</i></li><li data-genre="rock, alternative, metal"><strong>System of a Down</strong><img src="http://userserve-ak.last.fm/serve/126/245515.jpg"><i>rock, alternative, metal</i></li><li data-genre="rock, alternative, indie"><strong>Beck</strong><img src="http://userserve-ak.last.fm/serve/126/259710.jpg"><i>rock, alternative, indie</i></li><li data-genre="pop, soul, rnb, female vocalists"><strong>Mariah Carey</strong><img src="http://userserve-ak.last.fm/serve/126/46603581.png"><i>pop, soul, rnb, female vocalists</i></li><li data-genre="rock, alternative, indie"><strong>Sufjan Stevens</strong><img src="http://userserve-ak.last.fm/serve/126/20422985.jpg"><i>rock, alternative, indie</i></li><li data-genre="pop, rock, alternative, indie"><strong>R.E.M.</strong><img src="http://userserve-ak.last.fm/serve/126/11528009.jpg"><i>pop, rock, alternative, indie</i></li><li data-genre="pop, rock, alternative, indie, britpop"><strong>Coldplay</strong><img src="http://userserve-ak.last.fm/serve/126/5854.jpg"><i>pop, rock, alternative, indie, britpop</i></li><li data-genre="electronic, house, dance"><strong>Bob Sinclar</strong><img src="http://userserve-ak.last.fm/serve/126/367149.jpg"><i>electronic, house, dance</i></li><li data-genre="rock, alternative, indie, electronic"><strong>Radiohead</strong><img src="http://userserve-ak.last.fm/serve/126/409718.jpg"><i>rock, alternative, indie, electronic</i></li><li data-genre="pop, alternative, indie, british, female vocalists"><strong>Florence + The Machine</strong><img src="http://userserve-ak.last.fm/serve/126/70693100.png"><i>pop, alternative, indie, british, female vocalists</i></li><li data-genre="hip hop, funk, jazz"><strong>A Tribe Called Quest</strong><img src="http://userserve-ak.last.fm/serve/126/49332549.png"><i>hip hop, funk, jazz</i></li><li data-genre="pop, electronic"><strong>The Knife</strong><img src="http://userserve-ak.last.fm/serve/126/41550351.jpg"><i>pop, electronic</i></li><li data-genre="rock, alternative, grunge"><strong>Pearl Jam</strong><img src="http://userserve-ak.last.fm/serve/126/3019178.jpg"><i>rock, alternative, grunge</i></li><li data-genre="rock, metal"><strong>Rammstein</strong><img src="http://userserve-ak.last.fm/serve/126/35627425.jpg"><i>rock, metal</i></li><li data-genre="rock, punk"><strong>Misfits</strong><img src="http://userserve-ak.last.fm/serve/126/27310105.jpg"><i>rock, punk</i></li><li data-genre="rock, alternative, grunge"><strong>Soundgarden</strong><img src="http://userserve-ak.last.fm/serve/126/70398948.png"><i>rock, alternative, grunge</i></li><li data-genre="electronic, house, dance"><strong>Armand van Helden</strong><img src="http://userserve-ak.last.fm/serve/126/24314811.jpg"><i>electronic, house, dance</i></li><li data-genre="electronic"><strong>Sebastian</strong><img src="http://userserve-ak.last.fm/serve/126/28588509.jpg"><i>electronic</i></li><li data-genre="rock, indie, electronic"><strong>M83</strong><img src="http://userserve-ak.last.fm/serve/126/71481450.png"><i>rock, indie, electronic</i></li><li data-genre="pop, rock, alternative, indie, british, britpop"><strong>The Kooks</strong><img src="http://userserve-ak.last.fm/serve/126/327708.jpg"><i>pop, rock, alternative, indie, british, britpop</i></li><li data-genre="rock, alternative, metal"><strong>Disturbed</strong><img src="http://userserve-ak.last.fm/serve/126/103442.jpg"><i>rock, alternative, metal</i></li><li data-genre="rock, classic rock"><strong>Led Zeppelin</strong><img src="http://userserve-ak.last.fm/serve/126/58547309.jpg"><i>rock, classic rock</i></li><li data-genre="electronic, dance"><strong>Digitalism</strong><img src="http://userserve-ak.last.fm/serve/126/23313477.jpg"><i>electronic, dance</i></li><li data-genre="pop, rock, alternative, punk"><strong>blink-182</strong><img src="http://userserve-ak.last.fm/serve/126/12050.jpg"><i>pop, rock, alternative, punk</i></li><li data-genre="rock, punk"><strong>Rise Against</strong><img src="http://userserve-ak.last.fm/serve/126/45406029.jpg"><i>rock, punk</i></li><li data-genre="pop, rock, alternative, indie, british, britpop"><strong>Blur</strong><img src="http://userserve-ak.last.fm/serve/126/4864949.jpg"><i>pop, rock, alternative, indie, british, britpop</i></li><li data-genre="rock, metal"><strong>Iron Maiden</strong><img src="http://userserve-ak.last.fm/serve/126/384201.jpg"><i>rock, metal</i></li><li data-genre="electronic, house"><strong>deadmau5</strong><img src="http://userserve-ak.last.fm/serve/126/66078728.png"><i>electronic, house</i></li><li data-genre="pop, electronic"><strong>Depeche Mode</strong><img src="http://userserve-ak.last.fm/serve/126/60866.jpg"><i>pop, electronic</i></li><li data-genre="pop, electronic, dance, female vocalists"><strong>Lady Gaga</strong><img src="http://userserve-ak.last.fm/serve/126/73968344.png"><i>pop, electronic, dance, female vocalists</i></li><li data-genre="disco, soul, funk, dance"><strong>Chic</strong><img src="http://userserve-ak.last.fm/serve/126/47626993.png"><i>disco, soul, funk, dance</i></li><li data-genre="rock, alternative, indie"><strong>Modest Mouse</strong><img src="http://userserve-ak.last.fm/serve/126/886281.jpg"><i>rock, alternative, indie</i></li><li data-genre="pop, electronic, dance, female vocalists"><strong>Madonna</strong><img src="http://userserve-ak.last.fm/serve/126/74976888.png"><i>pop, electronic, dance, female vocalists</i></li><li data-genre="soul, rnb, funk, blues"><strong>Al Green</strong><img src="http://userserve-ak.last.fm/serve/126/40156941.png"><i>soul, rnb, funk, blues</i></li><li data-genre="pop, rnb, dance, female vocalists"><strong>Rihanna</strong><img src="http://userserve-ak.last.fm/serve/126/71057304.png"><i>pop, rnb, dance, female vocalists</i></li><li data-genre="pop, soul, rnb, female vocalists"><strong>Destiny's Child</strong><img src="http://userserve-ak.last.fm/serve/126/61806641.png"><i>pop, soul, rnb, female vocalists</i></li><li data-genre="pop, soul, rnb, female vocalists"><strong>Beyoncé</strong><img src="http://userserve-ak.last.fm/serve/126/63374449.png"><i>pop, soul, rnb, female vocalists</i></li><li data-genre="rock, punk, classic rock"><strong>Ramones</strong><img src="http://userserve-ak.last.fm/serve/126/6700337.jpg"><i>rock, punk, classic rock</i></li><li data-genre="electronic"><strong>Boys Noize</strong><img src="http://userserve-ak.last.fm/serve/126/57782391.jpg"><i>electronic</i></li><li data-genre="electronic, dance"><strong>The Prodigy</strong><img src="http://userserve-ak.last.fm/serve/126/79566.jpg"><i>electronic, dance</i></li><li data-genre="pop, rock, british, classic rock"><strong>The Beatles</strong><img src="http://userserve-ak.last.fm/serve/126/2158493.jpg"><i>pop, rock, british, classic rock</i></li><li data-genre="electronic, house, dance"><strong>Benny Benassi</strong><img src="http://userserve-ak.last.fm/serve/126/39124739.png"><i>electronic, house, dance</i></li><li data-genre="electronic, house, dance"><strong>Daft Punk</strong><img src="http://userserve-ak.last.fm/serve/126/5463.jpg"><i>electronic, house, dance</i></li><li data-genre="pop, disco, electronic, dance"><strong>Hercules And Love Affair</strong><img src="http://userserve-ak.last.fm/serve/126/57115257.png"><i>pop, disco, electronic, dance</i></li><li data-genre="electronic, house, dance"><strong>David Guetta</strong><img src="http://userserve-ak.last.fm/serve/126/43155097.png"><i>electronic, house, dance</i></li><li data-genre="pop, rock, alternative, classic rock"><strong>U2</strong><img src="http://userserve-ak.last.fm/serve/126/380317.jpg"><i>pop, rock, alternative, classic rock</i></li><li data-genre="alternative, electronic, female vocalists"><strong>Björk</strong><img src="http://userserve-ak.last.fm/serve/126/188639.jpg"><i>alternative, electronic, female vocalists</i></li><li data-genre="rock, british, blues, classic rock"><strong>The Rolling Stones</strong><img src="http://userserve-ak.last.fm/serve/126/23408343.jpg"><i>rock, british, blues, classic rock</i></li><li data-genre="rock, punk, british, classic rock"><strong>The Clash</strong><img src="http://userserve-ak.last.fm/serve/126/36023147.jpg"><i>rock, punk, british, classic rock</i></li><li data-genre="rock, soul, funk, blues, classic rock"><strong>Sly & The Family Stone</strong><img src="http://userserve-ak.last.fm/serve/126/7566637.jpg"><i>rock, soul, funk, blues, classic rock</i></li><li data-genre="rock, metal"><strong>Metallica</strong><img src="http://userserve-ak.last.fm/serve/126/7560709.jpg"><i>rock, metal</i></li><li data-genre="rock, indie"><strong>Elliott Smith</strong><img src="http://userserve-ak.last.fm/serve/126/882073.jpg"><i>rock, indie</i></li><li data-genre="rock, alternative, hip hop"><strong>Beastie Boys</strong><img src="http://userserve-ak.last.fm/serve/126/392387.jpg"><i>rock, alternative, hip hop</i></li><li data-genre="rock, alternative, indie"><strong>Death Cab for Cutie</strong><img src="http://userserve-ak.last.fm/serve/126/60010487.jpg"><i>rock, alternative, indie</i></li><li data-genre="rock, indie"><strong>Bright Eyes</strong><img src="http://userserve-ak.last.fm/serve/126/179424.jpg"><i>rock, indie</i></li><li data-genre="soul, rnb, female vocalists"><strong>Mary J. Blige</strong><img src="http://userserve-ak.last.fm/serve/126/49215123.png"><i>soul, rnb, female vocalists</i></li><li data-genre="metal"><strong>Megadeth</strong><img src="http://userserve-ak.last.fm/serve/126/8129787.jpg"><i>metal</i></li><li data-genre="rock, blues, classic rock"><strong>Jimi Hendrix</strong><img src="http://userserve-ak.last.fm/serve/126/162545.jpg"><i>rock, blues, classic rock</i></li><li data-genre="rock, alternative, grunge"><strong>Bush</strong><img src="http://userserve-ak.last.fm/serve/126/57943.jpg"><i>rock, alternative, grunge</i></li><li data-genre="metal"><strong>Slayer</strong><img src="http://userserve-ak.last.fm/serve/126/5063959.jpg"><i>metal</i></li><li data-genre="pop, rock, soul, funk"><strong>Prince</strong><img src="http://userserve-ak.last.fm/serve/126/178948.jpg"><i>pop, rock, soul, funk</i></li><li data-genre="rock, alternative, grunge"><strong>Mudhoney</strong><img src="http://userserve-ak.last.fm/serve/126/17894323.jpg"><i>rock, alternative, grunge</i></li><li data-genre="pop, disco, dance"><strong>Boney M.</strong><img src="http://userserve-ak.last.fm/serve/126/38736073.png"><i>pop, disco, dance</i></li><li data-genre="pop, soul, rnb, jazz, female vocalists"><strong>Joss Stone</strong><img src="http://userserve-ak.last.fm/serve/126/3643924.jpg"><i>pop, soul, rnb, jazz, female vocalists</i></li><li data-genre="pop, electronic, funk, dance, jazz"><strong>Jamiroquai</strong><img src="http://userserve-ak.last.fm/serve/126/42322663.png"><i>pop, electronic, funk, dance, jazz</i></li><li data-genre="alternative, punk, indie"><strong>The Smiths</strong><img src="http://userserve-ak.last.fm/serve/126/49596745.png"><i>alternative, punk, indie</i></li><li data-genre="electronic"><strong>Crystal Castles</strong><img src="http://userserve-ak.last.fm/serve/126/66643832.jpg"><i>electronic</i></li><li data-genre="rock, blues, classic rock"><strong>Buddy Guy</strong><img src="http://userserve-ak.last.fm/serve/126/12224445.jpg"><i>rock, blues, classic rock</i></li><li data-genre="soul, british, jazz, female vocalists"><strong>Amy Winehouse</strong><img src="http://userserve-ak.last.fm/serve/126/27937567.png"><i>soul, british, jazz, female vocalists</i></li><li data-genre="pop, dance, female vocalists"><strong>Britney Spears</strong><img src="http://userserve-ak.last.fm/serve/126/67838764.png"><i>pop, dance, female vocalists</i></li><li data-genre="soul, blues"><strong>Otis Redding</strong><img src="http://userserve-ak.last.fm/serve/126/51686497.png"><i>soul, blues</i></li><li data-genre="disco, soul, rnb, funk"><strong>Earth\,\ Wind & Fire</strong><img src="http://userserve-ak.last.fm/serve/126/52210229.png"><i>disco, soul, rnb, funk</i></li><li data-genre="rock, alternative, indie, electronic"><strong>Gorillaz</strong><img src="http://userserve-ak.last.fm/serve/126/20114893.jpg"><i>rock, alternative, indie, electronic</i></li><li data-genre="hip hop"><strong>Jay-Z</strong><img src="http://userserve-ak.last.fm/serve/126/391231.jpg"><i>hip hop</i></li><li data-genre="blues"><strong>Muddy Waters</strong><img src="http://userserve-ak.last.fm/serve/126/52223547.png"><i>blues</i></li><li data-genre="rock, classic rock"><strong>Pink Floyd</strong><img src="http://userserve-ak.last.fm/serve/126/28958091.jpg"><i>rock, classic rock</i></li><li data-genre="electronic, house, dance"><strong>Kaskade</strong><img src="http://userserve-ak.last.fm/serve/126/25169451.png"><i>electronic, house, dance</i></li><li data-genre="rock, alternative, metal"><strong>Korn</strong><img src="http://userserve-ak.last.fm/serve/126/32578399.jpg"><i>rock, alternative, metal</i></li><li data-genre="rock, indie, blues"><strong>The Black Keys</strong><img src="http://userserve-ak.last.fm/serve/126/58672183.png"><i>rock, indie, blues</i></li><li data-genre="soul, rnb, funk, blues"><strong>James Brown</strong><img src="http://userserve-ak.last.fm/serve/126/18066833.jpg"><i>soul, rnb, funk, blues</i></li><li data-genre="pop, soul, rnb, dance, female vocalists"><strong>Christina Aguilera</strong><img src="http://userserve-ak.last.fm/serve/126/51599275.png"><i>pop, soul, rnb, dance, female vocalists</i></li><li data-genre="indie, hip hop, british"><strong>The Streets</strong><img src="http://userserve-ak.last.fm/serve/126/58637295.jpg"><i>indie, hip hop, british</i></li><li data-genre="electronic, dance"><strong>Vitalic</strong><img src="http://userserve-ak.last.fm/serve/126/3594740.jpg"><i>electronic, dance</i></li><li data-genre="pop, rock, disco, classic rock"><strong>Bee Gees</strong><img src="http://userserve-ak.last.fm/serve/126/33475253.png"><i>pop, rock, disco, classic rock</i></li><li data-genre="rock, soul, funk"><strong>Funkadelic</strong><img src="http://userserve-ak.last.fm/serve/126/36994685.jpg"><i>rock, soul, funk</i></li><li data-genre="hip hop"><strong>Nas</strong><img src="http://userserve-ak.last.fm/serve/126/53803679.jpg"><i>hip hop</i></li><li data-genre="indie, soul, british, female vocalists"><strong>Adele</strong><img src="http://userserve-ak.last.fm/serve/126/71796928.png"><i>indie, soul, british, female vocalists</i></li><li data-genre="rock, metal, classic rock"><strong>Deep Purple</strong><img src="http://userserve-ak.last.fm/serve/126/278332.jpg"><i>rock, metal, classic rock</i></li><li data-genre="pop, hip hop"><strong>Eminem</strong><img src="http://userserve-ak.last.fm/serve/126/33623311.png"><i>pop, hip hop</i></li><li data-genre="rock, alternative, grunge"><strong>Nirvana</strong><img src="http://userserve-ak.last.fm/serve/126/6129427.jpg"><i>rock, alternative, grunge</i></li><li data-genre="pop, electronic, house, dance"><strong>Basement Jaxx</strong><img src="http://userserve-ak.last.fm/serve/126/15599061.jpg"><i>pop, electronic, house, dance</i></li><li data-genre="rock, classic rock"><strong>Bruce Springsteen</strong><img src="http://userserve-ak.last.fm/serve/126/275858.jpg"><i>rock, classic rock</i></li><li data-genre="soul, rnb, funk, blues"><strong>Marvin Gaye</strong><img src="http://userserve-ak.last.fm/serve/126/3356337.jpg"><i>soul, rnb, funk, blues</i></li><li data-genre="pop, soul, rnb"><strong>Ne-Yo</strong><img src="http://userserve-ak.last.fm/serve/126/49782677.png"><i>pop, soul, rnb</i></li><li data-genre="alternative, hip hop"><strong>Cypress Hill</strong><img src="http://userserve-ak.last.fm/serve/126/3012139.jpg"><i>alternative, hip hop</i></li><li data-genre="electronic, house, dance"><strong>Avicii</strong><img src="http://userserve-ak.last.fm/serve/126/70336236.jpg"><i>electronic, house, dance</i></li><li data-genre="rock, blues, classic rock"><strong>Eric Clapton</strong><img src="http://userserve-ak.last.fm/serve/126/2366379.jpg"><i>rock, blues, classic rock</i></li><li data-genre="rock, alternative, punk"><strong>Bad Religion</strong><img src="http://userserve-ak.last.fm/serve/126/44413489.jpg"><i>rock, alternative, punk</i></li><li data-genre="rock, alternative, grunge"><strong>Foo Fighters</strong><img src="http://userserve-ak.last.fm/serve/126/2530129.jpg"><i>rock, alternative, grunge</i></li><li data-genre="pop, dance, female vocalists"><strong>Cascada</strong><img src="http://userserve-ak.last.fm/serve/126/75200428.png"><i>pop, dance, female vocalists</i></li><li data-genre="rock, alternative, metal"><strong>Marilyn Manson</strong><img src="http://userserve-ak.last.fm/serve/126/184500.jpg"><i>rock, alternative, metal</i></li><li data-genre="rock, classic rock"><strong>Creedence Clearwater Revival</strong><img src="http://userserve-ak.last.fm/serve/126/12903593.jpg"><i>rock, classic rock</i></li><li data-genre="alternative, hip hop, soul"><strong>Common</strong><img src="http://userserve-ak.last.fm/serve/126/171040.jpg"><i>alternative, hip hop, soul</i></li><li data-genre="rock, alternative, blues"><strong>Tom Waits</strong><img src="http://userserve-ak.last.fm/serve/126/38183285.jpg"><i>rock, alternative, blues</i></li><li data-genre="rock, alternative, grunge"><strong>Silverchair</strong><img src="http://userserve-ak.last.fm/serve/126/20540173.jpg"><i>rock, alternative, grunge</i></li><li data-genre="rock, alternative, punk"><strong>The Offspring</strong><img src="http://userserve-ak.last.fm/serve/126/8155449.jpg"><i>rock, alternative, punk</i></li><li data-genre="pop, disco, dance"><strong>Village People</strong><img src="http://userserve-ak.last.fm/serve/126/4810881.jpg"><i>pop, disco, dance</i></li><li data-genre="pop, rock, indie, female vocalists"><strong>Katy Perry</strong><img src="http://userserve-ak.last.fm/serve/126/55399029.png"><i>pop, rock, indie, female vocalists</i></li><li data-genre="rock, alternative, classic rock"><strong>David Bowie</strong><img src="http://userserve-ak.last.fm/serve/126/42133371.png"><i>rock, alternative, classic rock</i></li><li data-genre="pop, soul, rnb, female vocalists"><strong>Aaliyah</strong><img src="http://userserve-ak.last.fm/serve/126/73847956.png"><i>pop, soul, rnb, female vocalists</i></li><li data-genre="pop, rock, alternative, punk"><strong>Green Day</strong><img src="http://userserve-ak.last.fm/serve/126/23074825.jpg"><i>pop, rock, alternative, punk</i></li><li data-genre="pop, rock, alternative, indie"><strong>Belle and Sebastian</strong><img src="http://userserve-ak.last.fm/serve/126/309385.jpg"><i>pop, rock, alternative, indie</i></li></ul>
</div>
</div>
<a id="fork" href="http://github.com/luis-almeida"><img src="https://a248.e.akamai.net/assets.github.com/img/e6bef7a091f5f3138b8cd40bc3e114258dd68ddf/687474703a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f7265645f6161303030302e706e67" alt="Fork me on GitHub"></a>
<script>
var _gaq=[['_setAccount','UA-30247115-1'],['_trackPageview']];
(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
s.parentNode.insertBefore(g,s)}(document,'script'));
</script>
</body>
</html>