How to use the universal-transition function in universal-transition

To help you get started, we’ve selected a few universal-transition examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github alibaba / rax / templates / template-retail / templates / default / pages / index / components / StoresNews / index.js View on Github external
resetAnimate() {
    const length = this.props.sourceData.length;
    if (length < 2) {
      return;
    }
    const ref = findDOMNode(this.animateElement);
    this.curr = 0;
    transition(ref, {
      transform: 'translate(0, 0)'
    }, {
      timingFunction: 'ease',
      delay: 0,
      duration: 0
    });
    this.fastAnimate(this.animateElement1, 0);
    this.fastAnimate(this.animateElement2, this.itemHeight * this.props.sourceData.length);
  }
github alibaba / rax / packages / rax-tabheader / src / animation.js View on Github external
transition: (Node, style, callback) => {
    transition(Node, style, {
      timingFunction: 'ease',
      delay: 0,
      duration: 300
    }, function() {
      callback && callback();
    });
  },
github alibaba / rax / templates / template-retail / templates / default / pages / index / mods / lazyload.js View on Github external
loadAnimate() {
    transition(findDOMNode(this.imageRef), {
      opacity: 1
    }, {
      timingFunction: 'ease-in-out',
      delay: 0,
      duration: 300
    });
  }
github alibaba / rax / components / rax-menulist / src / index.js View on Github external
setTimeout(() => {
        transition(menuList, {
          opacity: 0
        }, {
          timingFunction: 'ease',
          delay: 0,
          duration: 300,
        }, () => {
          this.setState({
            visible: false
          });
        });
      }, 50);
    }
github alibaba / rax / components / rax-tab-panel / src / DefaultView.js View on Github external
switchTo = (index, options = {params: {}}) => {
    let {beforeSwitch = noop, afterSwitch = noop} = this.props;
    let {duration = this.props.duration, params} = options;
    index = clamp(index, 0, this.itemCount - 1);
    let prevIndex = this.curIndex;
    beforeSwitch({index, params, prevIndex});
    this.curIndex = index;
    this.renderPanel(index);
    let itemWidth = this.itemWidth;
    let end = -index * itemWidth;
    const wrap = findDOMNode(this.refs.wrap);
    transition(wrap, {
      transform: `translateX(${end}rem)`,
      webkitTransform: `translateX(${end}rem)`
    }, {
      timingFunction: this.props.easing,
      delay: 0,
      duration: Math.max(this.props.isSlideEnabled ? duration : 0, MIN_DURATION)
    }, () => {
      this.curIndex = index;
      afterSwitch({index, params, prevIndex});
      this.handleScreens();
      this.handleSwipeBack();
    });
  }
github alibaba / rax / packages / rax-modal / src / index.js View on Github external
animated = (state, callback) => {
    const {visible} = state;
    const {delay, duration} = this.props;
    transition(findDOMNode(this.refs.mask), {
      opacity: visible === true ? 1 : 0
    }, {
      timingFunction: 'ease',
      delay,
      duration
    }, () => {
      callback && callback();
    });
  }
github alibaba / rax / universal / universal-animation / src / index.js View on Github external
map(transitionMap, (o) => {
        let transitionProps = {
          ...o.props,
          ...o.props.transform ? {
            transform: o.props.transform.join(' '),
            webkitTransform: o.props.transform.join(' ')
          } : {}
        };

        transition(o.element, transitionProps, {
          duration: o.duration,
          timingFunction: o.easing,
          delay: o.delay
        }, (e) => {
          if (o.duration === maxDuration && !callbackFlag) {
            callback && callback(e);
            callbackFlag = true;
          }
        });
      });
    }

universal-transition

A universal transition API.

BSD-3-Clause
Latest version published 5 years ago

Package Health Score

52 / 100
Full package analysis

Popular universal-transition functions