How can i link two images to each other in a single web page??

Question

Like, I click on 1st img then 2nd img takes its place and when I click on 2nd img then 1st img takes it's place , and this happens with every clicking....

Sorry for bad English.. 🙏🙏

Answer 1

Html alone cannot be interactive with user actions... but you could avoid JS by using Css instead (wich could handle some interactivity/dynamic changes of the html styling):

https://code.sololearn.com/W60C4KtmAtTU/?ref=app

Answer 2

I don't have to much time to type code and then show u output. Don't keep on discussing .

Answer 3

Give the image id attributes and link to their id
https://code.sololearn.com/WnOPkoeIrqd8/?ref=app

Answer 4

Why setting and removing immediatly the best answer mark on my post?

Answer 5

Wow! Your solution (if exists/works) would be quite hardest than your first explanation would suggest if it take more time to do than writting some posts ;P

All I could imagine working as what I understand from your second post, doesn't necessarly implie ids (any good chosen css selectors will do the work and certainly not by giving the same id to differents elements) and doesn't implies JS at all: check this code of mine recently done in few minutes to show how to switch images on click (with pure Html/Css -- under the hood we use the same trick than my first linked code, but in its simplest version, as button are more complexe to handle, all the more when there are commands duplicated: ie, the switch button who do same job than the on and off buttons and reciprocally):

https://code.sololearn.com/W60C4KtmAtTU/?ref=app

Answer 6

⚡🌀♏️ystery🌀⚡ I have updated it. I had to use javascript to handke cluck events
https://code.sololearn.com/WnOPkoeIrqd8/?ref=app

Answer 7

You may find answer in https://www.quora.com/How-we-place-two-images-side-by-side-in-html?ch=10&share=fce42972&srid=5rAgu

Answer 8

Ore Adeleye Maybe you did not read my description, I said that the second image should take the place of the first. But in your code both are already in page

Answer 9

Ore Adeleye thanks...
But... can't I just do the same thing by only using HTML ??

Answer 10

visph thanks for help 🤗

Answer 11

Technical Master sure you cannot do with only html, but you're not mandatory to use js: you could use only css (with html obviously)... check my code posted previously ;)

Answer 12

In this case image id should be same but source be different. After that make a button and call it by id.
By same id of two different images if u click button 1st times get 1st image and another u get 2nd image on same place in same web page. 😊😊

Answer 13

Anand Kumar can you show an example??

Answer 14

⚡🌀♏️ystery🌀⚡ More of less like this:

https://code.sololearn.com/Wkx3lK98uFpB/?ref=app

Anand Kumar not sure to good understand your idea: I doubt of your explanation of both image with same id wich magically get switched (by selecting by id, you will ever get the first element with the matching id encountered, and never others ^^)

Answer 15

I am unable to show u here bro but an example i kept here:- just on/off of bulb. In place of bulb has two different images one is glow state and another off state. By clicking it came one by one.

Answer 16

Yes, you describe the primary goal, we are ok... but it's your "magic" that I cannot figure ^^

Why are you unable to show us? :o