У вас в основном правильные инструменты mootools, но вам не хватает нескольких ключевых элементов, которые бы обеспечивали правильную работу вашего скрипта.Ниже я вставил рабочую версию, а затем сделал несколько комментариев:
var slide = new Fx.Slide($("error"));
slide.slideOut('horizontal').chain(function () {
$('error').set('text', message); this.callChain(); //NOTE
}).chain(function () {
this.slideIn('horizontal');
}).chain(function () {
this.slideOut.delay(3000, this, 'horizontal'); //NOTE
});
- Обратите внимание на this.callChain () в 3-й строке.Отсутствие этого было тем, что мешало вам видеть что-либо.Класс Fx использует метод callChain () для внутреннего запуска следующего шага в последовательности, но если ваш аргумент для chain () не содержит один из методов Fx, callChain () не вызывается, поэтому вы должны сделать это вручную.
- Ваш звонок с задержкой был не в том месте.Delay () задерживает выполнение функции, к которой она применяется, она не вставляет паузу в цепочку.Поэтому, чтобы отобразить сообщение об ошибке в течение 3 секунд, вам нужно добавить задержку к последнему вызову функции, потому что это та, которую вы хотите замедлить
- Ваш вызов задержки был неверным.Задержка относится к функции, а не к возвращаемому значению функции, отсюда и предложение Димитра выше.Посмотрите function в основной документации mootools для получения дополнительной информации
- По звукам у вас не установлен firebug.Это позволило бы вам изучить DOM и обнаружить, что ваш код меняет поля, а затем текст, но после этого ничего не происходит.Firebug очень полезен, поэтому установите его КАК МОЖНО СКОРЕЕ
- Мое решение (mootools 1.3) приведено ниже и в основном исправляет то, что предлагал dimitar:
$('error').set('slide', {
mode: 'horizontal'
}).get('slide').slideOut().chain(function () {
$('error').set('text', message); this.slideIn();
}, function () {
this.slideOut.delay(3000, this);
});
Надеюсь, это поможет