MooTools: элемент затухания?

Question

У меня есть объект Element, который я сейчас вызываю .hide (). Вместо этого я хотел бы уменьшить непрозрачность всего элемента (и его дочерних элементов) до 100% (скрытого) в качестве эффекта перехода в течение, возможно, 500 мс или 1000 мс.

Можно ли использовать Fx.Tween для этого? Возможно ли это - имеет ли фреймворк MooTools такой эффект в своей библиотеке пользовательского интерфейса?

Answer 1

В MooTools 1.3 вы можете установить параметры анимации, такие как продолжительность или переход, например:

$('tweener').set('tween', {duration: 2000}).fade('out');

См. Также пример jsfiddle http://jsfiddle.net/tofu/VU7Es/

и документы http://mootools.net/docs/core/Fx/Fx.Tween#Element-Properties:tween

Answer 2

 $('myElement').fade(0.7);

устанавливает непрозрачность элемента равной 70%. Или

$('myElement').fade('out'); // fades the element out.

http://mootools.net/docs/core/Fx/Fx.Tween#Element:fade

Элемент Метод: исчезать
Элемент ярлык метод для твин с непрозрачностью. полезным для затухания элемента внутрь или наружу или определенный уровень непрозрачности.

Answer 3

Используйте

 $('myElement').fade('toggle')`;

он будет автоматически появляться и исчезать в зависимости от его состояния.

Пример: HTML

    <div style='background-color:black;color:white' id="tweener">
        HELLO WORLD
    </div>

    <button onclick="javascript:doTween()">TWEEN</button>

<script type='text/javascript'>
    function doTween()
    {

       $('tweener').fade('toggle'); // out, in are other options available.
    }
</script>

Answer 4

MooTools имеет метод fade () в пакете FX.Tween, как видно здесь .