I have been trying to get some CSS working but i've come to a hurdle where it works locally but not within vbulletin.
The code uses translate to animate the title so when it's too long for the container it will bounce left to right.
vBulletin 4.2.5
template: forumhome_forumbit_level2_post
Code:
<div class="radio-ani" style="color: {vb:raw sctrack.state};">{vb:raw sctrack.track}</div>
template: additional.css
Code:
.radio-ani {
overflow: hidden;
width: 15rem;
white-space: nowrap;
}
.radio-ani > * {
display: inline-block;
position: relative;
animation: 5s linear 0s infinite alternate move;
box-sizing: border-box;
padding: .8rem 1rem;
}
@keyframes move {
0%,
25% {
transform: translateX(0%);
left: 0%;
}
75%,
100% {
transform: translateX(-100%);
left: 100%;
}
}