试图在核心动画页面组件中将交叉淡入淡出效果更改为幻灯片效果答案

【问题标题】：Trying to change cross-fade-all effect to a slide effect in core-animated-pages componenet试图在核心动画页面组件中将交叉淡入淡出效果更改为幻灯片效果
【发布时间】：2015-03-20 09:31:06
【问题描述】：

我的聚合物元素中有核心动画页面元素：

<link rel="import" href="../public/components/core-animated-pages/core-animated-pages.html">

<polymer-element name="welcom-arrow" attributes="counter">
<template>
<style>

</style>
<core-animated-pages transitions="cross-fade-all" selected="{{welcomPage}}">
  <section>
    <div class="blueBackground">
      <h1>asd</h1>
      <h3>asdasdasdn</h3>
      <paper-button on-tap="{{Foward}}">
        Keep Going
        <core-icon icon="forward"></core-icon>
      </paper-button>
    </div>
  </section>
  <section>
    <div class="blueBackground">
      welcom 2
    </div>
  </section>
</core-animated-pages>
</template>
<script>
Polymer({
  welcomPage: 0,
  Foward: function() {
    this.welcomPage++;
  },
  Backward: function() {
    this.welcomPage--;
  }
});
</script>
</polymer-element>

我的交叉淡入淡出效果完美，但是当我想通过将cross-fade-all 属性交换为slide-from-right 将其更改为幻灯片效果时，效果不起作用。我该如何解决这个问题？

【问题讨论】：

标签： polymer

【解决方案1】：

您只需要导入转换本身。

<link rel="import" href="../public/components/core-animated-pages/transitions/slide-from-right.html">

现在你可以改变你的过渡了

<core-animated-pages transitions="slide-from-right" selected="{{welcomPage}}">

之前的转换之所以有效，是因为core-animated-pages 已经导入了它。

希望对您有所帮助！

【讨论】：