syntax error when adding image hover to image which already clicks thro' to a second page

My image is in an image block (not a code block) and clicks through to second page successfully. But I would like original image to hover on to second image as well as clicking thro' to second page. This is code I have entered but it brings up syntax error referencing <img line. Any help would be much appreciated. Thank you.

<img src="https://static1.squarespace.com/static/61cb2383021d34467e693bf6/t/61cdd953e537667a78e5a6bb/1640880473238/Katy+Hepburn_1SSBend1.png"
onmouseover="this.src=https://static1.squarespace.com/static/61cb2383021d34467e693bf6/t/61cdd97310a48011dfc6d8f4/1640880518189/KH+Bend+One+shine+image+1.png"
onmouseout="this.src=https://static1.squarespace.com/static/61cb2383021d34467e693bf6/t/61cdd953e537667a78e5a6bb/1640880473238/Katy+Hepburn_1SSBend1.png"
>

6 minutes ago, Dominique_48 said:

My image is in an image block (not a code block) and clicks through to second page successfully. But I would like original image to hover on to second image as well as clicking thro' to second page. This is code I have entered but it brings up syntax error referencing <img line. Any help would be much appreciated. Thank you.

<img src="https://static1.squarespace.com/static/61cb2383021d34467e693bf6/t/61cdd953e537667a78e5a6bb/1640880473238/Katy+Hepburn_1SSBend1.png"
onmouseover="this.src=https://static1.squarespace.com/static/61cb2383021d34467e693bf6/t/61cdd97310a48011dfc6d8f4/1640880518189/KH+Bend+One+shine+image+1.png"
onmouseout="this.src=https://static1.squarespace.com/static/61cb2383021d34467e693bf6/t/61cdd953e537667a78e5a6bb/1640880473238/Katy+Hepburn_1SSBend1.png"
>

You put in it Home > Design > Custom Css, didn't you? The Custom Css can not read the element tag like in the code block

Thank you very much. Yes, previously I created code in code block which worked with image hover but then I did not know how to add click through to second page. 

I found similar question in a forum where answer suggested no code block was required, see below -

_ _ _

I want to have an image on my website that changes when you hover over it and you can click which sends you to another page on the website.

I haven't been able to find this anywhere, maybe I'm just not asking the right question?

Here is the code I have so far which works for the hover image change, but I can't figure out how to make it clickable and redirect.

"<img src="Original-Image.pmg" onmouseover="this.src='second-image.png'" onmouseout="this.src='Original-Image.png'">"

Thanks for your help!

Tuanphan reply – 7 Jan 2020

No need to use Code Block.

First add Image Block

Next, upload image

Next, add link

Next, use CSS to change image on hover

_ _ _ _ _ _ _ _

Should I revert to code block which works for image hover but then how do I make it possible to click on image and be taken to a second page on the website?

Thanks again.

10 hours ago, Dominique_48 said:

Thank you very much. Yes, previously I created code in code block which worked with image hover but then I did not know how to add click through to second page. 

I found similar question in a forum where answer suggested no code block was required, see below -

_ _ _

I want to have an image on my website that changes when you hover over it and you can click which sends you to another page on the website.

I haven't been able to find this anywhere, maybe I'm just not asking the right question?

Here is the code I have so far which works for the hover image change, but I can't figure out how to make it clickable and redirect.

"<img src="Original-Image.pmg" onmouseover="this.src='second-image.png'" onmouseout="this.src='Original-Image.png'">"

Thanks for your help!

 

Tuanphan reply – 7 Jan 2020

No need to use Code Block.

First add Image Block

Next, upload image

Next, add link

Next, use CSS to change image on hover

_ _ _ _ _ _ _ _

Should I revert to code block which works for image hover but then how do I make it possible to click on image and be taken to a second page on the website?

Thanks again.

You can add Image Block, add a link. Then share link to page where you added image, we will give the code to add hover effect