title: How to focus on a previously opened window using window.open()
body: <p>I would like to open a popup window for a website and keep it for a music player to be able to play seamless music while the user is navigating across pages.</p>
  
  <p>What I would like to achieve is that when the user <strong>first clicks the "Music" button a new popup window opens</strong> using <code>window.open</code> (done). The second part would be that when the user navigates to other pages and clicks again on the "Music" button then the <strong>already open window receives the focus</strong> but doesn't load again.</p>
  
  <p>However what is happening is that as soon as the user navigates away from the original page then the <strong>browser forgets that the window has been opened and the focus() stops working</strong>. It seems that focus() works as far as the user is staying on the same page.</p>
  
  <p>I have found a similar question and tried to implement my code based on that question:</p>
  
  <p><a href="https://stackoverflow.com/questions/528671/javascript-window-open-only-if-the-window-does-not-already-exist">JavaScript window.open only if the window does not already exist</a></p>
  
  <p>Here is the code I have written so far:</p>
  
  <pre><code>$('a.music').click(function(){
          if(typeof(winRef) == 'undefined' || winRef.closed){
              winRef = window.open(this.href,'Music','left=20,top=20,width=500,height=500,toolbar=0,location=0,directories=0,status=0,menubar=0,scrollbars=0,resizable=1,titlebar=0');
          } else {
              winRef.focus();
          }
          return false;
      });
  </code></pre>
  
  <p>Here is the live site if you would like to have a look.
  <a href="http://ilhaamproject.com/" rel="nofollow noreferrer">http://ilhaamproject.com/</a></p>
  
  <p><strong>How should I reference the opened window such that it works across different page-loads?</strong></p>