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

Can summary block carousel do continuous loop forward (instead of fast-rewind backward)?


pixies1

Question

Hi there, I’m using a summary carousel block to display testimonials (actually blog posts). I click the right arrow to scroll through the testimonials. When I reach the last one, it stops and does this fast rewind left back to the first one.

Is it possible to add code so you can keep clicking the right arrow and it will keep cycling through in a continuous loop? I don’t want it to scroll automatically, I just want the right arrow (or left arrow) to keep cycling through instead of stopping at the end and then fast-rewinding back to the first one.

Any help is much appreciated. Thanks!

Link to comment

12 answers to this question

Recommended Posts

  • 0

Hi,
If you haven't received an answer yet, you can post on some FB groups
+ Squarespace Customization Resource Groups
+ Squarespace Community
+ Squarespace Entrepreneur
+ Squarespace Rockstars

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
On 3/5/2021 at 8:53 AM, pixies1 said:

Hi there, I’m using a summary carousel block to display testimonials (actually blog posts). I click the right arrow to scroll through the testimonials. When I reach the last one, it stops and does this fast rewind left back to the first one.

Is it possible to add code so you can keep clicking the right arrow and it will keep cycling through in a continuous loop? I don’t want it to scroll automatically, I just want the right arrow (or left arrow) to keep cycling through instead of stopping at the end and then fast-rewinding back to the first one.

Any help is much appreciated. Thanks!

Infinite loop currently not offered by default, you may want to implement a 3rd party carousel plugin such as swiper to support this

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, Delivery Date Picker, Youtube Gallery for Squarespace
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 comment
  • 0
On 3/6/2021 at 10:43 PM, bangank36 said:

Infinite loop currently not offered by default, you may want to implement a 3rd party carousel plugin such as swiper to support this

Hi Bangnank36,

I'm looking to do this for my carousel -- do you know where I can find out more on how to implement it?

Link to comment
  • 0

Thanks! To get this effect, I actually created one long image that scrolls continuously

First create a 5900x390px image with your logos spaced out evenly (you can do this for free at Canva.com)

Then add the code below to CSS (replacing my URL image with your own)

Hope it works for you!

 

//auto-scrolling logos//
.slider {
  width: 135%;
  overflow: hidden;
  margin-left: -13vw;
  margin-right: 0vw;
  position: relative;
}

.slider .slider-image {
  background-image: url(https://static1.squarespace.com/static/60606ea81846b4151d82ec0b/t/60be85e8d976482627d1592a/1623098856396/Slider.png);
  width: auto;
  height: 150px;
  background-size: 2950px 200px;
  animation: slide 50s linear infinite;
}

@keyframes slide {
  from {background-position-x: 0px;}
    to {background-position-x: -2950px;}
}

Link to comment
  • 0

Hi there, it's a code block with the following code:

<div class="slider">
  <div class="slider-image">
    
  </div>
</div>

Sorry I didn't think to include that in my previous message.

And thanks for finding/posting that video! I watched a similar one to figure out how to do it

Link to comment
  • 0
On 3/5/2021 at 12:53 PM, pixies1 said:

Hi there, I’m using a summary carousel block to display testimonials (actually blog posts). I click the right arrow to scroll through the testimonials. When I reach the last one, it stops and does this fast rewind left back to the first one.

Is it possible to add code so you can keep clicking the right arrow and it will keep cycling through in a continuous loop? I don’t want it to scroll automatically, I just want the right arrow (or left arrow) to keep cycling through instead of stopping at the end and then fast-rewinding back to the first one.

Any help is much appreciated. Thanks!

Trying to do the same thing.

Anyone else figured this out?

Cool solution above but I don't want to create a massive continuous scrolling image because:

1) the large image will take longer to load
2) testimonials are quotes and don't appear visually appealing continuously scrolling.

I want the testimonials to advance every few seconds automatically.

Link to comment

Create an account or sign in to comment

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

×
×
  • Create New...