浏览页面时如何保持音频播放？

Question

I am making a website for my friends band. I would like to know if its possible (apart from using Ajax) to keep audio playing after clicking on a link to another page on the site?

I currently have it set up using Ajax to reload the content, but I am having a few issues with it, and I'd rather not deal with the bother unless I really have to.

If not possible, is there a way to minimise the disruption (pausing then playing again) while navigating? It would be possible for the new page to continue playing the track from where the last page stopped, but I would like to minimise the pause. Or, on this subject, is it possible to keep certain page elements loaded after changing the URL (without using # urls), like facebook does (as in, you click on it, but the banner never disappears during loading)

Thanks for any help :)

Answer 1

Use Ajax to load content and History API's pushState() to alter URL without page reload.

For consistent behavior across browsers, consider using a wrapper library like History.js .

Answer 2

Sites like Facebook use JavaScript/AJAX for these kind of things. If you don't want to use it, you can use frames (not recommended). Divide the page in two frames: the player and the website itself. This way you can easily turn it off too, just open the site without frames.

Good luck!

Answer 3

Of course you could also pop up the player in another window/tab. (For now) It won't be possible without frames or javascript.

Answer 4

不同于通过AJAX来实现它可能会很麻烦，但是您可以使用IFrames，在IFrames中播放音乐，而在子菜单中显示内容，也可以始终将其制作为Flash网页。

Answer 5

Build it in Wordpress and use the AnythingSlider plugin to have the pages shift within the main page. This way you can have tabbed navigation and never leave the actual page. No need to write too much code. The AnythingSlider uses html for the slides.

You can also not use wordpress and just use the AnythingSlider code.

http://css-tricks.com/anythingslider-jquery-plugin/

and

http://wordpress.org/extend/plugins/anythingslider-for-wordpress/

and

http://css-tricks.com/examples/AnythingSlider/