Check Javascript element property change

Asked

Viewed 379 times

0

I have some div's of id 1, 2 and 3, respectively. They are inside the class page home.

For example: 

<div class="home">
  <div id="1" style="transform: translateX(0px);">blabla</div>
  <div id="2" style="transform: translateX(-1903px);">blabla</div>
  <div id="3" style="transform: translateX(-3806px);">blabla</div>
</div>

What I need to do is check the change in transform of these elements (no click, used for slide, when passed with mouse) to leave the links with specific class.

I am currently using this function:

var slider1 = $( '.home div#1' ).css( "transform" );
    var slider2 = $( '.home div#1' ).css( "transform" );
    var slider3 = $( '.home div#1' ).css( "transform" );
    if (slider1 == 'matrix(1, 0, 0, 1, 0, 0)') {
      $('.home a[href="#slider-1"]').addClass('slide-ativo');
      $('.home a[href="#slider-2"]').removeClass('slide-ativo');
      $('.home a[href="#slider-3"]').removeClass('slide-ativo');
      alert(slider1);
    } else if (slider2 == 'matrix(1, 0, 0, 1, -1903, 0)') {
      $('.home a[href="#slider-2"]').addClass('slide-ativo');
      $('.home a[href="#slider-1"]').removeClass('slide-ativo');
      $('.home a[href="#slider-3"]').removeClass('slide-ativo');
      alert(slider2);
    } else if (slider3 == 'matrix(1, 0, 0, 1, -3806, 0)') {
      $('.home a[href="#slider-3"]').addClass('slide-ativo');
      $('.home a[href="#slider-1"]').removeClass('slide-ativo');
      $('.home a[href="#slider-2"]').removeClass('slide-ativo');
      alert(slider3);
    } else {
      alert('error');
};

But only recognize when the page is loaded, I need you to recognize when the property of the element is changed.

javascript jquery slider

2 answers

0

0


Fez this example and I believe it’s already the solution to your problem

Browser other questions tagged javascript jquery slider

You are not signed in. Login or sign up in order to post.