PG slider tutorial Qs

[kat]

Below the slider is text.- why? ^.pgia-slider|.pgia-slides-container ^.pgia-slider|.pgia-slides-container ^.pgia-slider|.pgia-slides-container

<div class="pgia-controls">
    <a class="prev pgia-control" href="#" data-scroll-to="prev" data-pg-ia='{"l":[{"name":"ScrollTo","trg":"click","a":{"l":[{"t":"^.pgia-slider|.pgia-slides-container","l":[{"t":"tween","p":0,"d":0.5,"l":{"scrollTo":{"dest":"prev_page"}}}]}]},"pdef":"true"}]}'>&lsaquo;</a>^.pgia-slider|.pgia-slides-container                ^.pgia-slider|.pgia-slides-container                ^.pgia-slider|.pgia-slides-container<a class="next pgia-control" href="#" data-scroll-to="next">&rsaquo;</a>
    <div class="pgia-pagination">
        <a class="pgia-pagination-item" href="#"></a>
    </div>
</div>

[RobM]

Hi @kat,
Which slider is that. I looked at the three in the Interactions tab of the Library and none have that code. It looks like some code has been deleted. Here is what mine looks like:

Cheers,
Bob

[kat]

Creating a Slider with Pinegrow Interaction 2 | Pinegrow Web Editor

I’ve tossed and redownloaded slider-base. I’ll start again. Wish me luck.

[kat]

Do I apply the following instructions to pgia-controls or a . prev which I am currently on?
But let’s use a trick so that we can work with just this one interaction and apply the same interaction to all .pgia-controls .

• Go to the Timeline editor and click on the Transition bar to edit the transition settings
• For ScrollTo value enter ${target.data-scroll-to}
  
  

[RobM]

Hi @kat,
You should keep working with the existing animation on the .prev element.
Cheers,
Bob

[kat]

Clicking on pagination dots doesn’t work. Help please

[RobM]

Hi @kat,
Everything looks correct from the screen shot. My best guess is that there is a problem with the pagination controls on the main scroll scene. It should look like this:

Hope this helps,
Bob

[kat]

The same except Infinite Scroll wasn’t checked. Neither works.
No Infinite Scroll on pgia-slides-container
{“s”:“whole”,“snap”:“e”,“pag”:“p”,“pag_i”:"^.pgia-slider|.pgia-pagination-item",“pag_clone”:“true”,“pag_pa”:“Current”,“pag_pd”:"-Current",“pag_inf”:“true”}{“s”:“whole”,“snap”:“e”,“pag”:“p”,“pag_i”:"^.pgia-slider|.pgia-pagination-item",“pag_clone”:“true”,“pag_pa”:“Current”,“pag_pd”:"-Current",“pag_inf”:“true”}
________------
pgia-pagination-item
{“l”:[{“name”:“Current”,“trg”:“no”,“a”:{“l”:[{“t”:"",“l”:[{“t”:“tween”,“p”:0,“d”:0.2,“l”:{“scale”:1.5}}]}]}},{“name”:“ScrollToSlide”,“trg”:“click”,“a”:{“l”:[{“t”:"^.pgia-slider|.pgia-pagination-item",“l”:[{“t”:“tween”,“p”:0,“d”:0.5,“l”:{“scrollTo”:{“dest”:“item”}}}]}]},“pdef”:“true”}]}

[RobM]

Hi @kat,
Is your JavaScript turned on?
Can you check if the final project is working as expected?
Bob

[kat]

Final works fine in browser and in PG.
But in PG there are 4 pagination dots, in browser 3.
My Javascript is turned on and I turned on test clicks.

Maybe I’ll just continue on with the tutorial without the pagination section moving slides and see what happens.