Hello All,
I am trying to embed a audio player in my website. But the problem is as soon as i move to a new page song gets stopped. What should i do so that music cant get stopped and user can browse over the pages. I googled some suggested iframes but others denied it. Overall, majority of the people are against iframes.
Thanks
Shail
If you link to the file, it should open in the browser’s default player and play will be independent of whatever site page the visitor is on.
But i am working on a music site. It will have a thousand of songs. I need to show playlist too.
The simplest solution is to have the audio mp3 file when clicked pop up in a new tab or window.
The best solution (which is a lot more complex) is to go the route of something like soundcloud.com. This uses AJAX and a feature called HTML5 History to be able to navigate to different pages without actually re loading the page and stopping your music. Here is a link explaining sound clouds use of this more in depth:
Using the standard web stack ie. HTML that is impossible. The only way to do it would be to make sure the page is never reloaded. Which would mean using AJAX to dynamically change the page state to mimic browsing other pages. The other solution bearing in mind the music will stop when a page refreshes is to persistent the current frame to the next page and begin playing from that position once the page reloads. Though in that scenario there is nothing you can do to prevent the music from stopping when the page is loading. This something that must be required upfront by the client in initial planning for the AJAX solution because it drastically changes the scope and how the site must be built. Hope you aren’t to far in because you will probably have to redo everything if this is a hard and fast requirement. If the client just mentioned this as a side rather than a requirement in initial planning of the project than I would recommend saving yourself the trouble and either telling them it can’t be done on the current budget and/or offering up the second solution I suggested. Though it sounds like this might be for your own site and if you’re not a developer this just isn’t a realistic goal to accomplish. Maybe the second solution is but not the first. The other quick and dirty way to do it would be to toss the entire site in an iframe… which would be a terrible user experience and idea in general but in theory it is a “solution”.
So you suggest to use AJAX for this…
I suggest you use AJAX too. You can dynamically load all your site content within one page, like Gmail. This will take quite a bit of coding on both the server and the client side.