10 examples of 'javascript change font color based on value' in JavaScript

Every line of 'javascript change font color based on value' code snippets is scanned for vulnerabilities by our powerful machine learning engine that combs millions of open source libraries, ensuring your JavaScript code is secure.

All examples are scanned by Snyk Code

By copying the Snyk Code Snippets you agree to
this disclaimer
125function changeFontColor(c) {
126 config.pfc_font_color = c;
127 updateFontColor(c);
128}
Important

Use secure code every time

Secure your code as it's written. Use Snyk Code to scan source code in minutes – no build needed – and fix issues immediately. Enable Snyk Code

147function color(event) {
148 sketchpad.color = $(event.target).val();
149}
527updateFontColorButton() {
528 const container = this.getColorContainer();
529 let color = '#000000';
530 if(container && container.style && container.style.color) {
531 color = container.style.color;
532 }
533 else if (container) {
534 const el = /** @type {Element} */ (container.nodeType === goog.dom.NodeType.ELEMENT ? container : container.parentElement);
535 if(el) color = window.getComputedStyle(el).color;
536 }
537 // apply the color input and the button to the selection color
538 // update the button color in the tool bar
539 this.fontColorButtonEl.style.color = color;
540 return color;
541}
193function selectColor(value) {
194 buttonCtrl.hidePanel();
195 buttonCtrl.color(value);
196 applyFormat(buttonCtrl.settings.format, value);
197}
547onFontColorClick(event) {
548 // this.colorInput.focus();
549 const color = this.updateFontColorButton();
550 // update the color picker to match the value
551 // here we need to convert from rgb to hex because color picker is hex and element.style.color is rgb
552 this.colorInput.value = silex.utils.Style.rgbToHex(color);
553 // open the browser's color picker
554 this.colorInput.click();
555 this.colorInput.onchange = e => {
556 let container = this.getColorContainer();
557 // enclose the body into a span, do not apply color to it directly
558 // same for a simple text nodes
559 if(container.nodeName.toLowerCase() === 'body' || container.nodeType === goog.dom.NodeType.TEXT) {
560 container = document.createElement('span');
561 this.textField.getRange().surroundContents(container);
562 }
563 container.style.color = this.colorInput.value;
564 this.colorInput.onchange = null;
565 this.contentChanged();
566 }
567}
32function changeFont(e) {
33 //localStorage.setItem("pfc_font",e.target.value);
34 settings.set('pfc_font',e.target.value);
35 chrome.tabs.executeScript(null, {code:"changeFont("+e.target.value+");"});
36}
323set_color(name, index, font) {
324 const canvas = document.getElementById(name);
325 const ctx = canvas.getContext("2d");
326 const rgb = font.get_rgb(index);
327 ctx.fillStyle = `rgb(${rgb.r}, ${rgb.g}, ${rgb.b})`;
328 ctx.fillRect(0, 0, canvas.width, canvas.height);
329}
221function setColor( color ) {
222 var colorStyle = config[ 'colorButton_' + type + 'Style' ];
223 // Clean up any conflicting style within the range.
224 editor.removeStyle( new CKEDITOR.style( colorStyle, { color: 'inherit' } ) );
225
226 colorStyle.childRule = type == 'back' ?
227 function( element ) {
228 // It's better to apply background color as the innermost style. (https://dev.ckeditor.com/ticket/3599)
229 // Except for "unstylable elements". (https://dev.ckeditor.com/ticket/6103)
230 return isUnstylable( element );
231 } : function( element ) {
232 // Fore color style must be applied inside links instead of around it. (https://dev.ckeditor.com/ticket/4772,https://dev.ckeditor.com/ticket/6908)
233 return !( element.is( 'a' ) || element.getElementsByTag( 'a' ).count() ) || isUnstylable( element );
234 };
235
236 editor.focus();
237 if ( color ) {
238 editor.applyStyle( new CKEDITOR.style( colorStyle, { color: color } ) );
239 }
240 editor.fire( 'saveSnapshot' );
241}
33function highlightColor(color) {
34 document.getElementById('black').style.border = "2px solid black";
35 document.getElementById('red').style.border = "2px solid black";
36 document.getElementById('yellow').style.border = "2px solid black";
37 document.getElementById('green').style.border = "2px solid black";
38 document.getElementById('blue').style.border = "2px solid black";
39
40 document.getElementById(color).style.border = "3px solid orange";
41 var vColor;
42 switch( color ) {
43 case "red":
44 vColor = [255, 0, 0];
45 break;
46 case "yellow":
47 vColor = [255, 255, 0];
48 break;
49 case "green":
50 vColor = [0, 255, 0];
51 break;
52 case "blue":
53 vColor = [0, 0, 255];
54 break;
55 default:
56 vColor = [0, 0, 0];
57 break;
58 }
59 vwf_view.kernel.setProperty( appID, "lineColor", vColor );
60}
197function setFont(size) {
198 document.getElementById("textArea").style.fontSize = size + 'px';
199 storage.set('fontSizePreference', { fontSizePreference: size }, function(error) {
200 if (error) throw error;
201 });
202}

Related snippets