Отображение содержимого вкладки после эффекта затухания

На моей странице есть несколько вкладок, и я хочу показать содержимое вкладок, дав эффект затухания. Для этого мне нужна вкладка div, которая имеет имя класса sectionContent после функции fade, чтобы быть style="display:block". Однако, когда я смотрю на них из firebug, это показано как, например:

<div id="lesson-grammar" class="sectionContent" style=""> 

и поэтому вкладка не отображается. Как я могу это сделать? большое спасибо.

new Ajax.Request(ajaxUrl,
  {
     method:'post',
     onSuccess: function(data){         
         var tmp=data.responseText;
         $$('.exercise-main .content').invoke('insert',tmp);
         $$('.exercise-main .sectionContent').invoke('setStyle','display:none');

         $('lesson-'+tab).fade({
             from:0,
             to:1,
             afterFinish: function(){
              //do the job                                     
             }
         });

     }
 });

<div class="exercise-main">
  <div class="content">
    <div id="lesson-discussion" class="sectionContent">  
     ...
    </div>
    <div id="lesson-grammar" class="sectionContent">  
     ...
    </div>
    <div id="lesson-dialogue" class="sectionContent">  
     ...
    </div>
   </div>
</div>

2 ответа

Решение

Позвольте мне сначала понять вашу проблему, исходя из вашего кода и вашего объяснения.

Чего вы хотите добиться - это скрыть все вкладки после получения ответа ajax, вставить ответ в новую вкладку, а затем отобразить его с эффектом затухания?

Если это ваше желание, то у вас, вероятно, есть проблема с селектором. Вы используете $$ селекторы, кроме одного места:

$('lesson-'+tab).fade({...

Я думаю, что это проблема. Ваша консоль Firefox/ Chrome показывает какие-либо проблемы? Что если вы попытаетесь запустить это:

$('lesson-'+tab)

Что происходит? Вы видите правильный элемент HTML, зарегистрированный в консоли?

Попробуйте это, затем дайте мне знать результат, и я постараюсь помочь.

Я считаю, что ваше объявление стиля не в правильном синтаксисе. Попробуй это:

$$('.exercise-main .sectionContent').invoke('setStyle',{display: "none"});
Другие вопросы по тегам