pr怎么让滚动字幕停留三秒
PR如何让滚动字幕停留三秒
在PR(公关)中,滚动字幕是一种常见的展示方式,可以吸引人们的注意力并传达信息。有时候,我们希望字幕在滚动过程中停留一段时间,给观众足够的时间阅读和理解。下面将介绍两种方法来实现这个效果。
方法一:使用JavaScript
1. 在HTML文件中,找到滚动字幕的代码段。一般情况下,会使用
2. 在
marquee {
animation: pause 3s linear;
}
@keyframes pause {
0%, 100% {
animation-timing-function: steps(1);
}
50% {
animation-timing-function: steps(50);
}
}
3. 保存HTML文件并重新加载页面,你会发现滚动字幕会在每次滚动到中心位置时停留三秒钟。
方法二:使用CSS动画
1. 在CSS文件中,找到滚动字幕的选择器,并添加以下属性:
.scrolling-text {
animation: pause 3s infinite;
}
@keyframes pause {
0%, 100% {
transform: translateX(0);
}
50% {
transform: translateX(calc(50vw - 150px));
}
}
2. 在HTML文件中,找到滚动字幕的元素,并为它添加一个class,例如:
3. 保存CSS文件和HTML文件,并重新加载页面,你会看到滚动字幕会在滚动到一半的位置停留三秒钟。
以上是通过调整代码来实现让滚动字幕停留三秒的两种方法。可以根据具体情况选择合适的方法来实现效果。希望本文能帮助到你!
版权声明:本文内容由互联网用户自发贡献,本站不承担相关法律责任.如有侵权/违法内容,本站将立刻删除。