Jump to content

Change an image on clicking on a text word


Lensmeister

Recommended Posts

Hoping someone can help me with this.

The basis is a single webpage that has a fair amount of text on it but also has a feature thus:
One line of three words: Cardiff | Manchester | Both

Below is an image: Initially when the page loads it will have the cardiff.gif 

Then when Manchester is clicked the cardiff disappears and the manchester.gif appears in the same place. Same for when the Both word is clicked.

I just need something simple/

I sourced this from the net

html>
    <body>

        <img id ="imageOne" src ="circleRed.png" onclick = "changeColor()"/>

        <script>
            var image =  document.getElementById("imageOne");

            function changeColor()
            {
                if (image.getAttribute('src') == "circleRed.png")
                {
                    image.src = "circleBlue.png";
                }
                else
                {
                    image.src = "circleRed.png";
                }
            }
        </script>
    </body>
</html>

This is for clicking an image. to change things.

I tried to edit for my needs but It just isn't working. I don't have a lot of experience with javascript or css.

All help is gratefully received. 

 

Thanks in advance,

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...