I'm using swipejs (https://github.com/bradbirdsall/Swipe) and want to add a class to certain DOM elements if the slide being slided to has a data attribute.
In this case a slide may have the attribute of data-colour="orange". When sliding to that slide I want to addClass '.orange' to any DOM element that hasClass '.colour'
HTML:
<!-- Slide 1 -->
<div class="slide" data-colour="orange">
<h1 class="center">we know sport</h1>
</div>
<!-- Slide 2 -->
<div class="slide" data-colour="blue">
<h1 class="center">we really know football</h1>
</div>
jQuery:
$(document).ready(function(){
var elem = document.getElementById('mySwipe');
window.mySwipe = Swipe(elem, {
callback: function(){
colour.addClass($('.slide').data('colour'));
}
});
});
This performs the desired action, but will only apply the data attribute of the current slide when sliding to the next slide, whereas I would like to work out the data attribute of the next slide, and when sliding to it add that as a class to other DOM elements.
Any help would be greatly appreciated.