Change font colour in mutiple text box elements on hover

Ask the community
,
1

Hi,

I want to change the font colour inside text box elements on mouse in and mouse out etc.

Is there a way of specifying multiple text box element ids and changing them all in the same function or do you have to code for each and every element (repeat over and over again)?

I.e. have to repeat this code below again and again…or is there a better way if dealing with multiple text boxes?

$w.onReady(function () {
$w(’ #text1 ‘).onMouseIn(()=>{hoverTxt();});
$w(’ #text1 ‘).onMouseOut(()=>{unhoverText();});
});
function hoverTxt(){
let oldHtmlStr = $w(’ #text1 ‘).html;
let newHtmlStr = oldHtmlStr.replace(/ #E0760D /i, ‘#402858’);
console.log(newHtmlStr);
$w(’ #text1 ‘).html = newHtmlStr;
}
function unhoverText(){
let oldHtmlStr = $w(’ #text1 ').html;
let newHtmlStr = oldHtmlStr.replace(/#402858/i, ’ #E0760D ‘);
console.log(newHtmlStr);
$w(’ #text1 ').html = newHtmlStr;

2

i have found some simpler code: but how can I change the code to avoid reverting default p3 style and using a specified font?

export function text1_mouseIn(event, $w) {$w(“#text1”).html = ‘

’ + $w(“#text1”).text+‘

’}

export function text1_mouseOut(event, $w) {$w(“#text1”).html = ‘

’ + $w(“#text1”).text +‘

’}