Style Javascript Textelement in CSS or Javascript itself

user_13501170 0
Viewed 82

I have put a Javascript text element in an HTML div field and now I want the text color to be white. I also want to make a few other changes to the text. Now I wonder how I can style the text element or whether it can is possible in this form.

(Translated into Google Translate, may contain errors)

This is my javascript code:

var bghtooltipin = document.getElementById('bgh-tooltipin1');
var bghtooltipout = document.getElementById('bgh-tooltipout1');
bghtooltipin.addEventListener('mouseover', bghtooltipinmouseOver);
bghtooltipin.addEventListener('mouseout', bghtooltipoutmouseOut);

function bghtooltipinmouseOver() {
  bghtooltipout.innerHTML = 'Go to Login';
}

function bghtooltipoutmouseOut() {
  bghtooltipout.innerHTML = ' ';
}
element css text html javascript
3 Answers

there are 2 ways, either use css classes or direct style manipulation

var bghtooltipin = document.getElementById('bgh-tooltipin1');
var bghtooltipout = document.getElementById('bgh-tooltipout1');
bghtooltipin.addEventListener('mouseover', bghtooltipinmouseOver);
bghtooltipin.addEventListener('mouseout', bghtooltipoutmouseOut);

function bghtooltipinmouseOver() {
  bghtooltipout.innerHTML = 'Go to Login';
  bghtooltipin.style.color = "white";
}

function bghtooltipoutmouseOut() {
  bghtooltipout.innerHTML = ' ';
  bghtooltipin.style.color = "black";
}
<div id="bgh-tooltipin1">Test 1</div>
<div id="bgh-tooltipout1"></div>

user_23044740
user_44409870

Thanks @Józef Podlecki now I would like to add a small transition to my text, so that the text when hovering after about 6 milliseconds. That would be my second change to the text.

Because I didn't manage that with the classic style element.

user_135011700
Related