问题描述
起亚·奥拉(Kia Ora),我正在尝试找到一种方法,以便随着用户在离子列表中滚动而逐渐淡入和淡出卡片,以便当他们的卡片完全位于窗口中时,它会非常清晰,但当他们向上滑动时,它会变灰或淡出。谢谢!
HTML
FirebaseUser.isEmailVerified()
SCSS
<ion-list>
<ion-item style="background-color: #f0f4f9; padding:0 !important; margin-top: 0; " *ngFor="let item of cards">
<div style="width: 100%; height:400px; border-radius: 25px; margin-bottom: 20px; "
[ngStyle]="{'background':'url('+ item.image +')','background-size':'100% auto'} ">
<ion-col>
<ion-item style="margin-top:calc(100% - 50px); padding-left: 10px; width:100%"
(click)="openandHideDetail(item)">
<ion-label>
<h1 text-start>{{item.name}},<span>{{item.age}}</span></h1>
<div class="sameLineContent">
<ion-icon slot="start" name="sNow" expand="icon-only" mode="ios"></ion-icon>
<p text-start>{{item.occupation}}</p>
</div>
<div class="sameLineContent">
<ion-icon slot="start" name="pin" expand="icon-only" mode="ios"></ion-icon>
<p text-start>{{item.distance}}</p>
</div>
</ion-label>
<ion-icon name="information-circle" slot="end" expand="icon-only" color="light" class="info"></ion-icon>
</ion-item>
</ion-col>
</div>
</ion-item>
</ion-list>
<ion-infinite-scroll (ionInfinite)="doInfinite($event)">
<ion-infinite-scroll-content></ion-infinite-scroll-content>
</ion-infinite-scroll>
</ion-content>
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)