title: jQuery Colorbox open new page
body: <p>I have some javascript in my website looking like this.</p>
  
  <pre><code>&lt;script&gt;
  if($(window).width() &lt;= 1024){
      function openColorBox(){
      $.colorbox({iframe:true, width:"80%", height:"80%", href: "assets/mobile/lightbox.html"});
    }
  
      setTimeout(openColorBox, 1000);
  }
  &lt;/script&gt;
  </code></pre>
  
  <p>lightbox.html looks like this.</p>
  
  <pre><code>&lt;p class="headline"&gt;Welcome to&lt;/p&gt;
  &lt;p class="image-p"&gt;&lt;img align="middle" class="image" src="../css/images/cmapslogo.png"&gt;&lt;/p&gt;
  &lt;p class="text"&gt;Would you like to continue to the mobile site?&lt;/p&gt;
  &lt;p class="button-p"&gt;&lt;a href="index.html"&gt;&lt;button class="button button1"&gt;Go to mobile site&lt;/button&gt;&lt;/a&gt;&lt;/p&gt;
  </code></pre>
  
  <p>However, when someone presses the link to go to index.html, it loads it inside the jQuery colorbox. Can this link be loaded in the actual page and not the colorbox? Colorbox is from here:
  <a href="http://www.jacklmoore.com/colorbox/" rel="nofollow">http://www.jacklmoore.com/colorbox/</a></p>