-1

現在、これにより (画像) フェードアウト機能が終了し、その後フェードイン機能が起動します。画像をクロスフェードさせ、各画像の不透明度を重ねる必要があります。この仕事を得るのに苦労しています。考え？

_initFade: function () {
  this._timer = Y.later(this._intervalDuration, this, this._startPeriod, [], false);

},

_startPeriod: function () {
  this._timer = Y.later(this._intervalDuration, this, this._fadeOut, [], true);
  this._fadeOut();
},

_fadeOut: function(){
  var host = this.get('host');
  this._animOut.set('node', host._getCurrentBlock());
    this._animOut.once('end', this._fadeIn, this);
  this._animOut.run();      
},

_fadeIn: function(){
  var host = this.get('host'),
      blocks = host.get('blocks'),
      index = host.get('index');
      index = host._moveIndex(host._getNextIndex());

  var nextBlock = blocks.item(index);
  this._transparent(nextBlock);
  host.syncUI();
  this._animIn.set('node', nextBlock);
  this._animIn.run();
},
4

1 に答える 1

0

YUIは、同期して実行される複数のアニメーションをサポートしていません。しかし、Y.Animの「トゥイーン」イベントを見てください。アニメーションのフレームごとに呼び出されます。したがって、アニメーションを使用して1つの画像をフェードし、トゥイーンイベント中に2番目の画像の不透明度を調整できます。

たとえば、トゥイーンイベントを使用して、複数のアイテムを同時にアニメーション化します。

var someNode = Y.Node.create("<div></div>"); // invisible div to animate
Y.one(document.body).appendChild(someNode);
var anim = new Y.Anim({
    node: someNode,
    duration: 0.25,
    from: { color: 'red' },
    to: { color: 'white' } 
});
anim.on('tween', function(event){
    Y.StyleSheet().set('input.text.error', { backgroundColor: someNode.getStyle('color') });
    // other animations
});
于 2012-08-06T22:40:14.140 に答える