Music Portfolio Template with HTML5 and jQuery
Development July 26, 2010 by Mary Lou 26 Comments
Today we want to share a music portfolio template with you. The idea is to create an artist portfolio with a discography line up and HTML5 audio player jPlayer. The artist albums are shown using the jCarousel plugin and the user can add song samples to the play list and reorder the songs by dragging them.
The samples used are from the talented Ivan Chew at ccmixter.org. The original images come from Rick Harris at Flickr. All the albums are fictitious and are only shown for demonstration purposes. Any resemblance to existing bands or artists are unintended.
We hope you like this template and find it useful!
You might also like
-
Multimedia Gallery for Images, Video and Audio
-
Latest Tweets Tooltip with jQuery
-
Sliding Checkbox Actions Menu with jQuery
-
Interactive Image Vamp up with jQuery, CSS3 and PHP
-
jQuery Fancy Draggable Captcha
-
Thumbnails Navigation Gallery with jQuery
-
Related Posts Slide Out Boxes with jQuery and CSS3
-
Slide Down Box Menu with jQuery and CSS3
-
UI Elements: Search Box with Filter and Large Drop Down Menu
-
Minimalistic Slideshow Gallery with jQuery
very nice.. todos los proyectos realizados por ustedes son muy buenos, gracias por compartir..
solo le falta algo a este sitio un “DONE”.
bendiciones.
Very very good job and it is free.
A big thank you for your work.
this really fantastic
No way! You guys are awesome in our delivery and use of jquery. Thank you for shearing your knowledge with us.
It’s looks fantastic! Thank you so much for this :)
really great;
I use flash and php to do the same…
I get your version …
Thanks
thanks a lot,
you have done a great work again!!!
all the best to your life!
Philip
ooooo DONE excelente contenido
really nice!
Unfortunately I don’t have an artist in my customers :)
I have 2 clients who are singers and musicians but still, I’m not yet starting with HTML5. I just can’t see it working properly in all browsers so…..
Nice stuff though!
Genial. Es una pasada.
Gracias por compartirlo.
Thanks for your generosity! This will definitely add more professional vibe!Keep it up guys!
absoluty great! lovely user interfase, ajaxfy surfing, fast response in the player and the magic of jquery
congrats and thanks for do things like that, you’re pushing the webdesign steps foward !
adeus, from argentina
You guys are kicking my ass in the demos department. No lies ;)
Must say that the portfolio LOOKS nice, but is nothing that I’d expect from an artist portfolio. I’ve been producing music for 11 years and have yet to see an intuitive design.
Perhaps I should attempt myself, ofcourse I’m not that great a designer, but I have a better idea of the usability required for a portfolio catered for musicians from a musician.
@re1jo
Te?ekkürler hocam saolun / Thank you teacher.
hohohoho…its a rock
great :-bd
Hi there! Wow, I’m flattered you’ve used my music samples for this very, very cool demo. And I appreciate that you’ve incorporated the credits and all that. Nice.
Very nice. You’re a star, thanks for sharing!
Awesome tut! Thanks!!
los ejemplos desarrolados somuy buenos y tiene mucha utilidad para unir varios ejemplos y desarrollarlos o aplicarlos en comunidades virtuales
I’m trying to implement this, but the description section isn’t dynamic. If I put more than 6 songs or so per album, then the songs are on top of the description. Any tips?
I love the way it looks and works other than that, though!
incredible !, i just added to my web site
http://www.ajaxshake.com
Hello.. First it’s a great design and I wanted to use it for a page I have about Music and culture.. But I’m having problems with getting the songs to play.. I have tried all i know to get the directory to find it.
I works great from my local dir. But when I try to install the dir from my server it does not play the songs at all .. NULL.. I know its a directory issue but how to I direct the files so that the player picks it up?
http://www.handbagsonsales.com
Chanel Handbags
Gucci Handbags Gucci 2010 New Handbag
Hermes Handbags
Balenciaga Handbags
Bottega Veneta Handbags
Chloe Handbags
Coach Handbags
Dior Handbags
Fendi Handbags
Dolce & Gabbana Handbags
Hermes Handbags
Versace Handbags
Prada Handbags
internet explore its not working properly plz help me