-1

I have been working on a website that has some text with "text stroke", I want to change the color of that text stroke with javascript and I want four different colors.

But since it is a webkit I don't know how to do it.

This is the only thing I can think of:

    guessBox.style.["-webkit-text-stroke: #df0000 3px;"]
});

d2.addEventListener("click", function green() {
    guessBox.style.["-webkit-text-stroke: #005100 3px;"]
});

d3.addEventListener("click", function blue() {
    guessBox.style.["-webkit-text-stroke: #0029ff 3px;"]
});

d4.addEventListener("click", function white() {
    guessBox.style.["-webkit-text-stroke: #fff 3px;"]
});```
NGO
  • 11
  • 1

1 Answers1

0

Try this:

guessBox.style['-webkit-text-stroke'] = '1px black';

Follows a full working example:

const element = document.getElementById('text');
element.style['-webkit-text-stroke'] = '1px black';
console.log(element);
.text {
    -webkit-text-stroke: 3px black;
}
<div id="text" class="text">
 some text
</div>
Ricardo Rocha
  • 14,612
  • 20
  • 74
  • 130
  • does ctx change anything in this scenario? i tried the full working example and it worked, but it doesn't work on the page. could i be because i also use ctx for a background? – NGO Dec 03 '19 at 07:32