我正在使用从右侧到左侧的选框滚动。以下代码工作正常。但它不能顺利滚动。内容"徘徊在我身上停止"闪烁或闪烁。我需要100%平滑滚动下面的选框。请帮我。是否有可能没有javascript ??
<marquee behavior='scroll' direction='left' scrollamount='3' onmouseover='this.stop()' onmouseout='this.start()'>Hover on me to stop</marquee>
答案 0 :(得分:2)
如果您希望使用纯CSS尝试,那么这是最简单的方法。虽然您需要检查对旧浏览器的支持并添加供应商前缀。
.marquee-parent {
position: relative;
width: 100%;
overflow: hidden;
height: 30px;
}
.marquee-child {
display: block;
width: 147px;
/* width of your text div */
height: 30px;
/* height of your text div */
position: absolute;
animation: marquee 5s linear infinite; /* change 5s value to your desired speed */
}
.marquee-child:hover {
animation-play-state: paused;
cursor: pointer;
}
@keyframes marquee {
0% {
left: 100%;
}
100% {
left: -147px /* same as your text width */
}
}
<div class="marquee-parent">
<div class="marquee-child">
Hover on me to stop
</div>
</div>
答案 1 :(得分:-1)
派对有点晚了..
这是一个角度指令:https://github.com/davidtran/angular-marquee。你不接触任何js - 只需添加指令标签即可完成
<div angular-marquee></div>
它不依赖于“弃用的标签”论点,依赖于现代解决方案