0
每當頁面動畫，它跳到最後。內容上下非常快。霓虹動畫頁面跳動時動畫
樣式：
:host {
display: block;
padding: 10px;
}
#animatedPages .iron-selected {
position: static;
}
#animatedPages{
overflow: hidden;
}
HTML：
<paper-card class="fullwidth" heading="{{heading}}">
<div class="card-content">
<neon-animated-pages id="animatedPages"
selected="0"
entry-animation="[[entryAnimation]]"
exit-animation="[[exitAnimation]]">
<neon-animatable>
<paper-input label="Wat is de actieve ingrediënt in paracetamol?"></paper-input>
</neon-animatable>
<neon-animatable>
<paper-input label="Hoeveel is de max inname van hoestdrank per dag?"></paper-input>
</neon-animatable>
</neon-animated-pages>
</div>
<div class="card-actions">
<div class="layout-horizontal">
<paper-fab icon="arrow-back" on-tap="previousQuestion"></paper-fab>
<paper-fab icon="[[nextButtonIcon]]" class="margin-left-auto" on-tap="nextQuestion"
id="nextButton"></paper-fab>
</div>
</div>
</paper-card>
相關JS：
nextQuestion: function() {
if (!this.checkIfFinalQuestion()) {
this.entryAnimation = "slide-from-right-animation";
this.exitAnimation = "slide-left-animation";
this.$.animatedPages.selectNext();
if (this.checkIfFinalQuestion()) {
return this.transformNextButtonToSendButton(true);
}
return this.transformNextButtonToSendButton(false);
}
},
previousQuestion: function() {
if(this.checkIfFirstQuestion()){
return;
}
this.entryAnimation = "slide-from-left-animation";
this.exitAnimation = "slide-right-animation";
this.$.animatedPages.selectPrevious();
if(!this.checkIfFinalQuestion()){
return this.transformNextButtonToSendButton(false);
}
},
我試圖消除paddi從:host ng，但這並沒有幫助。我已將position: static放在.iron-selected上，因爲其他neon-animatable的高度不夠。