Ask coding questions

← Back to all posts
How do you keep an element on-screen when the user navigates off the page?
GavHern (64)

I'm wondering how sites like Soundcloud are able to keep an element there no matter what page the user is on. (In Soundcloud's case, the audio player.)

Commentshotnewtop
vedprad1 (732)

I do not know exactly how that happens, but something you can do is make the component in an external window. It does not work exactly like how you probably want it, but that's what I would do.

window.open('https://repl.it/talk/ask/How-do-you-keep-an-element-on-screen-when-the-user-navigates-off-the-page/17042', 'ext', 'height=300,width=300', false);
mwilki7 (280)

My guess is it copies the html data or whatever object data is there before page transition and hands it off to the next page to load it.

GavHern (64)

@mwilki7 I'd assume if you did that the audio player would stop for a moment.

mwilki7 (280)

@GavHern forgot about that part.
Next I would manually build new web pages with javascript/jquery so you never actually unloaded the page. Though, this is probably why no one would hire me for UI development lol.