Make your announcement even more eye-catching by creating a simple scrolling text animation! In this Squarespace tutorial, you'll learn how to turn the text in your announcement bar into a scrolling marquee.

Here is the code from this tutorial; be sure to adjust the 15 in 15s if you want it to be slower (30s for example) or faster (5s for example):

.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
}