Hello Guys, i badly need your help since i’m new to jquery/javascript. this is what i want to achieve: if the user will click the link inside the “content-slider-wrap”, it will toggle the “product-thumbnails” div
But the code i made will take effect in all the divs even if i only click the link inside the first div.
i want the toggle will take effect only on certain divs where i click it
please help me to do it
HTML:
<div>
<div>
<p>
<span>Eco:</span> "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
</p>
<a href="#"><img src="images/img-slider.png" alt="image" /></a>
</div>
<!--/end-content-slider-wrap-->
<div>
<div>
<a href="#"><img src="images/img-product-001.jpg" alt="product image" /></a>
</div>
</div>
<!--/end-product-thumbnails-->
</div>
<div>
<div>
<p>
<span>Eco:</span> "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
</p>
<a href="#"><img src="images/img-slider.png" alt="image" /></a>
</div>
<!--/end-content-slider-wrap-->
<div>
<div>
<a href="#"><img src="images/img-product-001.jpg" alt="product image" /></a>
</div>
</div>
<!--/end-product-thumbnails-->
</div>
the script i made:
$('.content-slider-wrap a').click(function(){
var $this= $(".product-thumbnails");
if($this.is(':hidden')) {
$this.show();
}else{
$this.hide();
}
});
thanks, Julie
