title: Link to bxSlider Slide
body: <h2>Problem:</h2>
  
  <p>I'm using bxSlider as main content on main page. I have <code>bxSlider</code> with 12 img for each slide. Then i have 12 blocks of html code for each slide. With jQuery i'm changing the content together with <code>bxSlider</code> using <code>onSlidePrev</code> and <code>onSlideNext</code> callbacks. Every thing works fine but the problem is when i click on links to the slides. I have a main menu with goes to selected slide, also have the "pager" and when i click on this things the content is not changing according callbacks.</p>
  
  <p>I'm calling bxSlider like this:</p>
  
  <pre><code>var slider = $('.bxslider').bxSlider({
              adaptiveHeight:false,
              infiniteLoop: false,
              onSlideNext: function ($slideElement, oldIndex, newIndex) {
                  switch(newIndex){
                      case 0:
                      $(".pag2, .pag3, .pag4, .pag5, .pag6, .pag7, .pag8, .pag9, .pag10, .pag11, .pag12").hide(); 
                              $(".pag1").show();
                                  break;
  
                                  case 1:
                      $(".pag1, .pag3, .pag4, .pag5, .pag6, .pag7, .pag8, .pag9, .pag10, .pag11, .pag12").hide(); 
                                  $(".pag2").show();
                                  break;
                  }           
              },
              onSlidePrev: function ($slideElement, oldIndex, newIndex) {
                  switch(newIndex){
                      case 0:
                      $(".pag2, .pag3, .pag4, .pag5, .pag6, .pag7, .pag8, .pag9, .pag10, .pag11, .pag12").hide(); 
                              $(".pag1").show();
                                  break;
  
                                  case 1:
                      $(".pag1, .pag3, .pag4, .pag5, .pag6, .pag7, .pag8, .pag9, .pag10, .pag11, .pag12").hide(); 
                                  $(".pag2").show();
                                  break;
                        } 
              }
          });
  </code></pre>
  
  <p>The HTML Code is this:</p>
  
  <pre><code>&lt;section class="pag1 section-height"&gt;
      &lt;h2 class="slideTitle"&gt;Title&lt;/h2&gt;
      &lt;h3 class="slideText"&gt;"Text&lt;/h3&gt;
  &lt;/section&gt;
  
   &lt;section class="pag2 section-height"&gt;
      &lt;h2 class="slideTitle"&gt;Title&lt;/h2&gt;
      &lt;h3 class="slideText"&gt;"Text&lt;/h3&gt;
  &lt;/section&gt;
  </code></pre>
  
  <h2>Ask:</h2>
  
  <p>How can i get this to work? I need to link this slides in another page.</p>