2012-05-10 4 views
0

Я использую jScrollpane для сайта clients'. Проблема, которую я имею, Является ли полоса прокрутки инициализирована на вкладке «Добро пожаловать». На вкладке «Продукты» мне также хотелось бы, чтобы эта вкладка имела ту же полосу прокрутки, что и вкладка «Добро пожаловать».jQuery инициализируется при нажатии?

Я использую Twitter Bootstrap для вкладок, и я не загружаю связанные с ними jQuery, это чисто по умолчанию.

Моего HTML код выглядит следующим образом:

<div class="tab-content"> 
      <div id="home" class="tab-pane active scroll_tab"> 
      <?php if (have_posts()) while (have_posts()) : the_post(); ?> 
      <h2> 
       <?php the_title(); ?> 
      </h2> 
      <?php the_content(); ?> 
      <?php endwhile; ?> 
      </div> 
      <div id="about" class="tab-pane"> 
      ABOUT CONTENT 
      </div> 
      <div id="services" class="tab-pane"> 
      <?php 
       $page_id = 11; 
       $page_data = get_page($page_id); 
       echo '<h2>'. $page_data->post_title .'</h2>';// echo the title 
       echo apply_filters('the_content', $page_data->post_content); // echo the content and retain Wordpress filters such as paragraph tags. 
      ?> 
      </div> 
      <div id="case_studies" class="tab-pane"> 
      CASE STUDIES CONTENT 
      </div> 
      <div id="contact_us" class="tab-pane"> 
      CONTACT US CONTENT 
      </div> 
     </div> 

Я тогда инициализация плагин JScrollPane на document.ready() в функции.

JQuery код выглядит следующим образом:

$(document).ready(function() 
    {  

/* Scrollbars */ 
$(function() 
{ 
    $('.scroll_tab').jScrollPane(); 
    $('.tab-content > .tab-pane, .pill-content > .pill-pane').jScrollPane(); 
}); 
}); 

Как заставить JScrollPane(); для инициализации на каждой вкладке?

Заранее спасибо.

+0

Можете ли вы привести пример на http://jsfiddle.net? – Gavriel

+0

Какой пример @Gavriel? – StuBlackett

+0

ваш html, css, js, чтобы мы могли видеть его в действии. – Gavriel

ответ

1

У меня есть идея: попробуйте вызвать $ ('. Tab-content> .tab-pane.active'). JScrollPane() ПОСЛЕ клика, который изменяется на другую вкладку. Я думаю, проблема заключается в том, что, пока другие (не первые) вкладки скрыты, jScrollPane не правильно вычисляет их высоту.

+0

Хороший ответ. Давая мне общее представление о том, что делать, я сделал следующий jQuery $ ('. Services_tab a'). Click (function() { \t \t $ ('# services'). JScrollPane(); \t}); который работает, но когда вы дважды щелкните вкладку продуктов: S? – StuBlackett

+0

Его два щелчка для его инициализации. Но его загрузка в ... – StuBlackett

+0

вам нужно сделать не как onclick, а внутри обратного вызова onclick, который уже существует (когда я нажимаю «Продукты», он вызывает обратный вызов, который меняет вкладку.) Там внутри внутри fuction, но ПОСЛЕ этого отобразите новую вкладку, которую вы должны сделать, потому что только тогда вкладка имеет реальную высоту. Функция onclick запускается до отображения вкладки, поэтому она все равно height = 0, как это было до вашего «исправления». – Gavriel