IOS页面
安卓页面
复现代码:
<template>
<view class="notice-wrap uni-flex">
<view class="notice-alt alt-linear">公告</view>
<view class="notice-type">疑情公告</view>
<view class="notice-mainwrap uni-flex">
<view class="notice-main">{{notice}}</view>
<!-- 第二条用于滚动效果 -->
<view class="notice-main1">{{notice}}</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
notice:"中民筑友码垛机作业区域一号工位发⽣疑似闯入行为中民筑友码垛机作业区域一号工位发⽣疑似闯入行为,发⽣时间2021年01月20日08时20分12秒。"
};
}
}
</script>
<style lang="less">
.notice-wrap{
background:#fff;
margin-top:32upx;
padding:18upx 30upx;
.notice-alt{
width:64upx;
font-size:22upx;
padding:7upx 0;
border-radius:10upx;
border-top-left-radius:0;
box-shadow:0 0 10upx rgba(255, 172, 5, .6);
font-weight:normal;
}
.notice-type{
font-size:22upx;
color:#365CDA;
border:2upx solid #365CDA;
padding:2upx;
border-radius:6upx;
margin:0 18upx 0 12upx;
}
.notice-mainwrap{
flex:1;
overflow:hidden;
white-space:nowrap;
.notice-main{
font-size:24upx;
color:#858585;
white-space:nowrap;
animation: 15s wordsLoop linear infinite normal;
}
.notice-main1{
font-size:24upx;
color:#858585;
white-space:nowrap;
animation: 15s wordsLoop linear infinite normal;
}
}
}
@keyframes wordsLoop {
0% {
transform: translateX(0px);
-webkit-transform: translateX(0px);
}
100% {
transform: translateX(-100%);
-webkit-transform: translateX(-100%);
}
}
</style>
小甜心呀 (作者)
iphone 7,iphone12 pro,系统均为IOS14.3
2021-01-20 15:23
小甜心呀 (作者)
您好,有复现吗,在线等求回复
2021-01-23 08:47
DCloud_UNI_Anne
回复 小甜心呀: iPhone XR IOS 14.2,未复现您说的问题。
2021-01-23 11:37