Fullscreen slider pagination?
-
Hi! Once again I'm here with a question... Would you have any suggestion on how to create page numbers for rows when using the fullscreen slider?
I am basically creating a site which is just one big carousel but would like to use the fullscreen slider instead of the carousel addon, so I can better customize the layout of each slide.
My problem is that I'd need to show numbers of each slide. I could, of course, put them there manually, but that would be a bit unpractical if I decide to change the order of the slides later.
Thank you so much for your help and the amazing work as always!
-
Okay… If someone is someday trying something similar, I kind of got a vague idea how to pull this off. So, in short, I try to create pagination 1/3, 2/3, 3/3 etc… to a site using full-screen slider addon.
I'm a complete newbie with jQuery/JS, so this could be tidied up for sure. But the only major thing I'm still struggling with is to count the number of elements to get the total amount of slides. Checking the number of slides with "length" works nicely on Chrome console, but when I add this to LayThemes custom head content it always returns "0".
<script> var totalCount = jQuery(".fp-slide").length; window.laytheme.on('newpageshown', function(){ console.log(totalCount); jQuery(".row-0 > .row-inner > .column-wrap > .col").append("<div class='page_number'>1 / "+totalCount+"</div>"); jQuery(".row-1 > .row-inner > .column-wrap > .col").append("<div class='page_number'>2 / "+totalCount+"</div>"); jQuery(".row-2 > .row-inner > .column-wrap > .col").append("<div class='page_number'>3 / "+totalCount+"</div>"); }); </script>
If someone notices some obvious thing that I'm missing to get the length work, I'd of course appreciate some quick tips! :)
-
Hej @nuotio did you somehow figure it out yet? I am working on something similar ... please let me know.
Thanks Fabian
I don't answer or check forum DMs, please just post on the forum.
Before you post:
Use the Search Feature. Maybe there is already a solution to your issue.
1. Update Lay Theme and all Lay Theme Addons
2. Disable all Plugins
3. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code ", click "Save Changes"
4. Now see if your problem solved itself
5. Go here, see if your problem is listed here:
Troubleshooting
When you post:
1. Post a link to where the problem is
2. If the problem is difficult to explain, post screenshots / link to a video to explain it