9grid Jquery

How to show selected thumbnail icon using jquery?

When we are working with Ecommerce website, we need to show current selected image with different style. If we show like this user can identify which image is selected currently. 

HTML:

<div class=”panel-thumbnail”>

         <div id=”thumbs”>                        

  <img class=”ThumbClassImage” ng-click=”ThumbImage(WebProductInfoData)” src=”{{WebProductInfoData.ImageUrl}}” alt=”interior design contemporary beach house” style=”cursor:pointer” id=”ThumbImage_{{WebProductInfoData.Product_Image_ID}}”>

</div>

            </div

JS:

  var ID=ThumbImageValue.Product_Image_ID;              

        $(‘.ThumbClassImage’).css(‘border-color’,”);

        $(‘#ThumbImage_’+ID).css(‘border-color’,’red’); 

Expalination:

Here we are showing selected image with the help of image id. And selected image will come as border-color is red.

OP:

Leave a comment

Your email address will not be published. Required fields are marked *