Matching different images

hi, i am trying to match images. this one works fine only with same images but i want to match unidentical images based on their id or src

below is the working code for similar images

can u help me the code with different images based on the image id or src. i am trying to do but i cant get it. plz help me with…


This should be pretty easy to achieve by adding a “data” attribute on the images that you need to match.

That way you can have a different image source and still match things up. For example if you had:

<img src="car.jpg" /> <!-- A car! -->
<img src="road.jpg" /> <!-- where do cars drive? A road! -->

You could relate these two by adding a data-attribute:

<img data-group="cars" src="car.jpg" /> <!-- A car! -->
<img data-group="cars" src="road.jpg" /> <!-- where do cars drive? A road! -->

<!-- another example -->
<img data-group="garden" src="flower.jpg" /> <!-- A flower! -->
<img data-group="garden" src="garden.jpg" /> <!-- where do flowers grow? A garden! -->

So instead of checking the SRC you could check the data-group.

I’ve updated your example to use this method:

Hope this helps :slight_smile: