youtube powered video gallery and isometry
Are those two related? They may not be. (They might be; who knows?)
Even so, I wanted to try out some isometry. You know, get some stuff displaying and sorting. That sort of thing? Big news: I did it!
That’s all for isometry, on to youtube powered video galleries!
- http://www.youtube.com/watch?v=L5JHMpLIqO4
- http://www.youtube.com/watch?v=VG82USg5mtE
- http://www.youtube.com/watch?v=-jMruFHTwrY
- http://www.youtube.com/watch?v=zxK8y7XuEu8
- http://www.youtube.com/watch?v=ADBKdSCbmiM
- http://www.youtube.com/watch?v=28sAsvzMW6s
- http://www.youtube.com/watch?v=V-24m-KRkn0
That’s one I made quickly. It works like this:
First you have some HTML.
<ul class="video library"> <li>http://www.youtube.com/watch?v=L5JHMpLIqO4</li> <li>http://www.youtube.com/watch?v=VG82USg5mtE</li> <li>http://www.youtube.com/watch?v=-jMruFHTwrY</li> <li>http://www.youtube.com/watch?v=zxK8y7XuEu8</li> <li>http://www.youtube.com/watch?v=ADBKdSCbmiM</li> <li>http://www.youtube.com/watch?v=28sAsvzMW6s</li> <li>http://www.youtube.com/watch?v=V-24m-KRkn0</li> </ul>
Just throw the Youtube URLs into a list and add the classes video and library to it, and that’s all there is to the HTML! (Well, there’s some minor javascript to include).
<link href="http://www.gigglingcorpse.com/dev/video-gallery/style.css" rel="stylesheet" type="text/css" media="screen" /> <script src="http://www.gigglingcorpse.com/dev/video-gallery/video-library.js" type="text/javascript"></script> <script src="http://www.google.com/jsapi" type="text/javascript"></script> <script type="text/javascript"> google.load("jquery", "1"); google.setOnLoadCallback(function() { videofy(); }); </script>
I included the Javascript file for you know doing stuff, as well as CSS file for some basic formatting. It makes use of JQuery, which i’ve included by way of Google’s JsAPI (out of laziness). And then when everything has loaded, there’s the one call to videofy().
After that, the list gets converted into the video gallery you should see above!
Thank you for your time.
