Check which slide is active with Java Script

Design help Custom code
1

Hey,

is there a way I can check which slide is active in a slider?
The reason I want to do this is that I have a java script running, but I want to stop the script once the last slide is reached.

Any help is much appreciated. :slight_smile:

Joe

2

The problem her is not to to know if the last slide is active:

$(".w-slider-dot:last-child").hasClass("w-active") /* return true on last slide */

The issue is - No event API (To know if the slide changed).

One way is to use the trick i use her (copy-paste before body)

<!-- attrchanger ## -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/attrchange/2.0.1/attrchange.min.js"></script>
<script>
  $(document).ready(function() {
    /* 2.2. check if last slide */
    $(".w-slide").attrchange({
      trackValues: true,
      callback: function(event) {
        var isLast = $(".w-slider-dot:last-child").hasClass("w-active") /* return true on last slide */
        if(isLast){
          console.log("do something on last slide");
        }
        else{
          console.log("not last slide");
        }
      }
    });
  });
</script>

Maybe use swiper.

reachEnd : Event will be fired when Swiper reach last slide

3

Hey!

Thanks for your reply! I made my own workaround for the problem of recognizing the change.

My script checks if the slider is on the last slide and I just let it continue to check every 0.1 seconds. I absolutely have no jquery experience at all and I‘m sure this is really bad coding. But it works :sweat_smile::sweat_smile:

Thank you for your answer though, it really helped me to solve the problem. :blush: