/ / פולימר: ביצוע אנימציה אנימציה דפים על יסוד פולימר אלמנט - פולימר

פולימר: ביצוע אנימציה אנימציה דפים על יסוד פולימר אלמנט - פולימר

אומרים שיש לי יישום פולימר אחד test-app, אחד div רגיל div-a, ואחד מרכיב פולימר page-a.

עכשיו אני מנסה לבנות animated-pages, אשר מכיל div-a ו page-a

<link rel="import" href="../../bower_components/core-header-panel/core-header-panel.html">
<link rel="import" href="../../bower_components/core-icons/core-icons.html">
<link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html">
<link rel="import" href="../../bower_components/core-animated-pages/core-animated-pages.html">

<link rel="import" href="../page-a/page-a.html">

<polymer-element name="test-app" flex vertical layout>

<template>
<core-animated-pages
selected="{{selected}}"
transitions="cross-fade"
>
<section name="div-a">
<div cross-fade>
<span>div-a</span>
</div>
</section>

<section name="page-a">
<page-a cross-fade></page-a>
</section>

</core-animated-pages>

</template>

<script src="./test-app.js"></script>

</polymer-element>

הבעיה היא: בעת ביצוע המעבר, ההנפשה מופעלת div-a עובד בסדר, אבל אחד על page-a לא עובד. במקום לדעוך, page-a רק פתאום מופיע.

נקודה מוזרה נוספת היא: אם אשנה transitions="cross-fade" לתוך transitions="cross-fade-all", ולהסיר אחרים cross-fade שהוגדר ב div ו page-a, הן מעברים לעבוד למצוא.

רעיון כלשהו?

תשובות:

0 לתשובה № 1

חוצה דהייה לא עובד ישירות על אלמנטים שיש להם overflow: hidden בחר.


שאלות קשורות


תגובות (0)

הוסף תגובה