How would I do a div without refresh

0

My question is the following, I am "developing" a web radio, and my problem is the following, when the user navigates the site he refresh the page and automatically the player stops playing, so my question is this, like I would make this div of the player not update with the navigation in the site?

<div id="player" class="align_left">
        <div class="align overflow">    
            <div class="botao align_left">
                <ul>
                    <li><button><i class="fa fa-play" aria-hidden="true" title="Play"></i></button></li>
                    <li><button><i class="fa fa-pause" aria-hidden="true" title="Pause"></i></button></li>
                </ul>
            </div>
            <audio src="http://stm4.srvstm.com:19404/;"class="player align_left" autoplay="autoplay"></audio></div>

What I have is this, and a small estimate of CSS , could anyone give an example of how to do this?

    
asked by anonymous 15.02.2018 / 23:38

1 answer

0

You can do this in two ways. With iframe or Pjax = PushState And Ajax .

Iframe

The iframe is basically a context of navigation. It incorporates an HTML page and thus allows you to have multiple pages in one.

You can do this as follows: link

pJax

pjax works like a request made in Ajax. The code sends a request to algum_pagina.php , that page is returned and treated.

You just need to define an identical "container" for all pages, so everything you have inside that "container" will be returned and displayed on the screen without updating it.

You can do this as follows: link

I'm building a site that follows this pattern. Follow Demo

    
16.02.2018 / 00:29