同时调用js函数yui

Calling js functions at same time yui

本文关键字:函数 yui js 调用      更新时间:2023-09-26

当前这导致(图像)淡入淡出函数结束,然后淡入淡出功能启动。我需要图像交叉渐变和每个图像的不透明度重叠。我很难完成这项工作。想法?

_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();
},
YUI不支持同步运行的多个动画。但看看Y.Anim的"青少年"事件吧。它是为动画的每一帧调用的。因此,您可以使用动画淡化一个图像,并在tween事件期间调整第二个图像的不透明度。

例如,我使用tween事件同时为多个项目设置动画:

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
});