Отображение содержимого вкладки после эффекта затухания
На моей странице есть несколько вкладок, и я хочу показать содержимое вкладок, дав эффект затухания. Для этого мне нужна вкладка 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"});