Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

Marquee Scrolling Text Announcement Bar


Recommended Posts

  • Replies 3
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Popular Posts

Site URL: https://www.milkglobal.net Morning/Evening guys, Has anyone managed to achieve a scrolling announcement bar that works on all devices. I've tried quite a few open source codes bu

Add this to Design->Custom CSS .sqs-announcement-bar-text { overflow: hidden; } #announcement-bar-text-inner-id { display:block; position:relative; width:100vw; animation:scroll 10s li

1 hour ago, Triick said:

Site URL: https://www.milkglobal.net

Morning/Evening guys,

Has anyone managed to achieve a scrolling announcement bar that works on all devices.

I've tried quite a few open source codes but nothing achieves a smooth transition from right to left.

If anyone has any advice it would be hugely appreciated.

Thanks
Dan

Add this to Design->Custom CSS

.sqs-announcement-bar-text {
  	overflow: hidden;
}
#announcement-bar-text-inner-id {
  	display:block;
	position:relative;
	width:100vw;
	animation:scroll 10s linear infinite;
	padding:3px;
}
@keyframes scroll {
	0% {left:800px;}
	100% {left:-800px;}
}

 

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, 360 Degree Photo block, Seperator Block (SVG Shape divider for sections)
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to post
2 hours ago, bangank36 said:

Add this to Design->Custom CSS


.sqs-announcement-bar-text {
  	overflow: hidden;
}
#announcement-bar-text-inner-id {
  	display:block;
	position:relative;
	width:100vw;
	animation:scroll 10s linear infinite;
	padding:3px;
}
@keyframes scroll {
	0% {left:800px;}
	100% {left:-800px;}
}

 

Is there a way to make it flawless, at the moment it finishes before the edge of the screen, Also can it start again before it reaches the left hand side?

 

Thanks

Link to post

Site URL: https://www.milkglobal.net

Hi guys,

 

Me again......Im not sure the marquee option is right for what I need so has anyone ever been able to animate the text in the announcement in a rolling style so I could have multiple Discount Codes that show after every 3 seconds etc?

I was trying marquee scroll but its not having the effect I desire.

Thanks

Dan

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...