michael_t_music Posted April 5, 2021 Share Posted April 5, 2021 Can anyone modify this css so it can make text wit the value "scroll" scroll vertically rather horizontally (it works horizontally and I tried replacing the word 'linear' with 'vertical' but that didnt work. .scroll{ overflow: hidden!important; position: relative!important; -moz-transform:translateX(100%); -webkit-transform:translateX(100%); transform:translateX(100%); -moz-animation: scroll 10s linear infinite; -webkit-animation: scroll 10s linear infinite; animation: scroll 10s linear infinite;} @-moz-keyframes scroll { 0% { -moz-transform: translateX(100%); } 100% { -moz-transform: translateX(-100%); } } @-webkit-keyframes scroll { 0% { -webkit-transform: translateX(100%); } 100% { -webkit-transform: translatex(-100%); } } #page {overflow-x:hidden} Link to comment
Wolfsilon Posted April 5, 2021 Share Posted April 5, 2021 .scroll{ overflow: hidden!important; position: relative!important; -moz-transform:translateY(100%); -webkit-transform:translateY(100%); transform:translateY(100%); -moz-animation: scroll 10s linear infinite; -webkit-animation: scroll 10s linear infinite; animation: scroll 10s linear infinite;} @-moz-keyframes scroll { 0% { -moz-transform: translateY(100%); } 100% { -moz-transform: translateY(-100%); } } @-webkit-keyframes scroll { 0% { -webkit-transform: translateY(100%); } 100% { -webkit-transform: translateY(-100%); } } #page {overflow-Y:hidden} I think your translate properties are causing the issue. Without context it's a little hard to understand the desired effect. Something I have to frequently remind myself is: translateX -- side to side translateY -- up and down Link to comment
Recommended Posts
Archived
This topic is now archived and is closed to further replies.