Configure the index of the image that will receive the style

Asked

Viewed 13 times

0

I have a group of imagens within a div:

<div class="boxSlide">
   <img src="_imgs/_slideShow/1.png" />
   <img src="_imgs/_slideShow/2.png" />
   <img src="_imgs/_slideShow/3.png" />
</div>

I would like to know the index each to use in the função down below:

$(document).ready(function(e) {

  $("div.slideShow div.contador span.contaSlide").click(function() {
      index = $(this).index();
      $("div.slideShow div.boxSlide img").css("opacity",0);
      $("div.slideShow div.boxSlide img").prop("index",index).css("opacity",1);
  });

});

But it doesn’t work. I’ve tried as below but the result is the same.

$("div.slideShow div.boxSlide img").val(index).css("opacity",1);

It seems that this part does not indicate which the figura that should receive the style

.prop("index",index)

Here is the HTML

<div class="slideShow">
  <div class="boxSlide">
     <img class="aberturaSelect" src="_imgs/_slideShow/1.png" />
     <img class="aberturaSelect" src="_imgs/_slideShow/2.png" />
     <img class="aberturaSelect" src="_imgs/_slideShow/3.png" />
     <div class="anterior">
        <span class="setaSpan"><</span>
        <span class="boxSpan"></span>
     </div>
     <div class="proximo">
        <span class="setaSpan">></span>
        <span class="boxSpan"></span>
      </div>
  </div>
  <div class="contador">
     <span class="contaSlide">1</span>
     <span class="contaSlide">2</span>
     <span class="contaSlide">3</span>
  </div>
</div>
jquery css3

1 answer

2

I got:

  $("div.slideShow div.boxSlide img").eq(index).css("opacity",1);

Thank you!

Browser other questions tagged jquery css3

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