Fullscreen Slider Counter
-
Hi everybody,
for anybody who is interested in having some kind of pagination/counter function for the fullscreen slider (e.g.. 1/20) I have a snippet I want to share with you.
<div class="num"></div>
<script> window.laytheme.on("newpageshown", function() { jQuery(window).on("fpAfterLoad", function() { var slideNumber = jQuery('.fp-section.active').index() -4; var numSections = jQuery('.fp-section').length; jQuery('.num').html(slideNumber + '/' + numSections) }); }); </script>
I don't why know but my counter only starts from 0 when I put -4 in the function. That probably needs to be adjusted in your case.
btw: code works for me with vertical fullscreen slider and auto-scrolling turned on.
Enjoy!
-
Dear @kalamakumaran
Thank you for the Code! 💥
Fullscreen Slider Addon comes with 'pagination' :)
Best wishes
Richard
-
Hej @Richard and @kalamakumaran
The Code seams not to work anymore, did something change in the meantime?
Tank you in advance and best regards,
Fabian -
For me it still works.
What exactly doesn’t work in your case?
Maybe I can help. -
Hej @kalamakumaran
Thank you so much for trying to help out. :)
I added the <script> and added the div but it does not show my row count and neither the actual row, it always shows me -4/1 ... have a look here: https://new.fabiandraxl.com/jaga/
So i think it has to do with something with the javascript which is not able to fetch the corresponding sections etc?!
Thank you and best regards,
Fabian -
Could be that the code is for any reason only working for the vertical fullscreen slider.
Why don't you just use the carousel plugin for a horizontal slideshow? There you can set up a counter without custom code.
Sorry that I can't help you any further with that.
Awesome website btw.
-
Hej @kalamakumaran,
Could be, but I personally have no clue. :P haha
Carousel is not that customizable, the side I showcased here was just an example wanted to built much more complex slides with the Gridder, which are not possible with the carousel plugin.
Thank you and have a great week!
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it