append css inline styles in js button for hover

Asked Jan 08 '21 at 09:44

Active Jan 19 '21 at 15:12

Viewed 39 times

im trying to set a different backgroundcolor from a button with an variable. the normal background is not a problem but when i want to change on hover it doesnt work. what am i doing wrong?

'<a href="'+data.weblink+'" target="_blank"><button style="background-color: '+color[1]+'; onMouserOver=backgroud-color:'+color[2]+'" class="template9_link_button">'+data.buttontext+'</button></a>';

so link and background is not a problem but hover or onMouseOver seems not to work. any suggestions?

edited Jan 19 '21 at 15:12

asked Jan 08 '21 at 09:44

Sander Bloem

1

Instead of generating inline styles, generate a style tag, so you can then add :hover pseudo class – Steve Tomlin Jan 08 '21 at 09:47
can i still use a variable from js? – Sander Bloem Jan 08 '21 at 09:58
You can use `css-in-js` if you want. There are many libraries for this particular use case. – Mindaugas Nakrosis Jan 08 '21 at 10:03
`this.style.backgroundColor = color[1]` – Chayim Friedman Jan 19 '21 at 15:14

append css inline styles in js button for hover

0 Answers0