Html代码:
<div class="toptu">
<div class="item scroll">
<img class="scroll-image lazyloaded"
src="https://img.ahap.cn/files/2022/01/20220201094537171.jpg"
data-was-processed="true">
<img class="scroll-image lazyloaded"
src="https://img.ahap.cn/files/2022/01/20220201094537171.jpg"
data-was-processed="true">
<div class="sc-1wssj0-17 hVBrzU">
<img src="https://img.ahap.cn/logo/logo.svg"
class="lazyloaded" data-was-processed="true">
</div>
</div>
</div>
Css代码:
.item.scroll {
left: 0px;
width: 100%;
height: 420px;
background-size: auto 100%;
pointer-events: none;
background-position: center center;
background-repeat: no-repeat;
transition: opacity 0.3s ease 0s;
white-space: nowrap;
overflow: hidden;
position: relative;
font-size: 0;
background: #000;
word-wrap: break-word;
box-sizing: border-box;
outline: none;
}
.item.scroll .scroll-image {
position: relative;
height: 100%;
transform: translateX(0px);
animation: banner 40s linear infinite;
opacity: 0.5;
border: 0;
-ms-interpolation-mode: bicubic;
vertical-align: middle;
}
.item img {
display: inline-block;
height: auto;
max-width: 100%;
vertical-align: middle;
}
.hVBrzU {
position: absolute;
top: 70px;
left: 0px;
right: 0px;
text-align: center;
font-size: 16px;
white-space: normal;
width: 100%;
margin: auto;
}
.item img {
display: inline-block;
height: auto;
max-width: 100%;
vertical-align: middle;
}
.sc-1wssj0-17 img {
width: auto;
}
@-webkit-keyframes banner {
from {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
to {
-webkit-transform: translateX(-100%);
-ms-transform: translateX(-100%);
transform: translateX(-100%);
}
}
@keyframes banner {
from {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
to {
-webkit-transform: translateX(-100%);
-ms-transform: translateX(-100%);
transform: translateX(-100%);
}
}
一、本站上的部份代码及教程来源于互联网,仅供网友学习交流。如有侵权,无意侵害您的权益,请发送邮件至xutian#ahap.cn或点击右侧 联系我们,我们将尽快处理。
二、请勿将购买的资源教程转载或分享与他人!
二、请勿将购买的资源教程转载或分享与他人!
这个人很懒,什么都没有留下!
站长你有没有发现在你自己创建的帖子下回复别人的评论,别人是看不到的,小铃铛也没用通知,你给别人点赞,别人就能看得见通知,比如你回复我,我在右上角的小铃铛是没得推送的,也没有消息记录
ahap
AM@498
小木屋运营
一开始不知道你在说啥,后来才发现这个问题,其实b2主题有这个回复评论提醒,但应该是出现bug了,现在只有自己回复自己才会有提醒,别人回复你是不提醒你的。
ahap
AM小木屋运营
[好看]
ahap
AM小木屋运营
[赞]