小编tb1*_*b11的帖子

尝试小提琴:http://jsfiddle.net/zhjk39qe/2/ - 单击按钮使框淡入/淡出.

当我点击按钮两次快速连续,我期望框开始第二淡出的一瞬间,但马上消失回来,而是在这个小提琴,该箱具有淡出了所有的方法,然后将淡出一路在.(第二次点击排队等候,感觉不太快.用户体验不佳.)

有没有办法立即强制进行第二次转换？

(一直在这里挖掘,但不知道去哪里:https://github.com/facebook/react/tree/master/src/addons/transitions)

JS在这里:

var ReactCSSTransitionGroup = React.addons.CSSTransitionGroup;
var Hello = React.createClass({
    getInitialState: function() {
      return {on: true};
    },
    onClick: function() {
      this.setState({on: !this.state.on});
    },
    render: function() {
        var k = this.state.on ? (<div> Hello {this.props.name} </div>) : "";
        return <div>
            <a href="#" onClick={this.onClick}> Click to toggle </a> <br/> <br/>
            <ReactCSSTransitionGroup transitionName="example">
              {k}
            </ReactCSSTransitionGroup>
          </div>;
    }
});

React.render(<Hello name="World" />, document.getElementById('container'));

我现在正在将背景居中（使用background-position: 50% 50%;），我想使用 Javascript 为其设置动画。但是，我希望能够使用像素测量来制作动画。实际上，我想将背景位置设置为“50% + 10px”之类的值。使用 JavaScript 可以吗？

我可以通过查找背景图像的高度和浏览器屏幕的高度并进行一些算术来做到这一点，但这似乎是一个复杂的解决方案。