Scrolling Announcement Bar
Tue Dec 28 2021 14:20:32 GMT+0000 (UTC)
Saved by
@jackie
#announcement
#bar
#scrolling
#underline
#link-text
.sqs-announcement-bar {
overflow: hidden;
}
.sqs-announcement-bar-text {
-moz-transform: translateX(100%);
-webkit-transform: translateX(100%);
transform: translateX(100%);
-moz-animation: scroll 15s linear infinite;
-webkit-animation: scroll 15s linear infinite;
animation: scroll 15s linear infinite;
}
@-moz-keyframes scroll {
from { -moz-transform: translateX(100%); }
to { -moz-transform: translateX(-100%); }
}
@-webkit-keyframes scroll {
from { -webkit-transform: translateX(100%); }
to { -webkit-transform: translateX(-100%); }
}
@keyframes scroll {
from {
-moz-transform: translateX(100%);
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
to {
-moz-transform: translateX(-100%);
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
.sqs-announcement-bar-close {display:none}
.sqs-announcement-bar-text a {
text-decoration: none !important;
}
content_copyCOPY
Makes marketing announcement bar at top of page scroll. Last but one line removes x to close the bar. Last line removes underline on hyperlink text.
https://insidethesquare.co/squarespace-tutorials/scrolling-announcement-bar
Comments