How to join these values in javascript?

function setopacity(opa,id){
    document.getElementById("txt"+id).style.opacity = "."+opa;
function setBColor(Bclr,id){
    document.getElementById("txt"+id).style.background = "#"+Bclr;

<div class="col-sm-1">
    <input required type="text" value="FF8C66"  class="jscolor form-control input-lg" name="Bclr[]" onChange="setBColor(this.value,<?php echo $row; ?>);" >

<div class="col-sm-1">
    <input required="required"  placeholder="opacity" value="20" type="number" min="5" class="form-control input-lg" name="opa[]" onChange="setopacity(this.value,<?php echo $row; ?>);" >

Above is my code (part of code) i'm able to set opacity with above code in my style tag in output but its apply to text and background I mean to both. but I want to apply only to background. how I can done this with my code.

I just try this but not able to get result.

function setBColor(Bclr,id){
    document.getElementById("txt"+id).style.background = "#"+Bclr+"."+opa;

And willing to get output like this

<li class="drag" thk="1" id="txt1" draggable="true" ondragstart="drag_start(event);" style="top: 231px; left: 64px; font-family: &quot;BalooPaaji-Regular.ttf&quot;; color: rgb(21, 0, 255); background-color: rgb(21, 0, 255,0.2);">Your Text 1 </li>

Update : i just want to add these 2 values +Bclr+"."+opa so i can get output like background-color: rgb(21, 0, 255,0.2); this

Please help me. Sorry for my poor English.

- - Source


answered 1 week ago Beniamin H #1

I hope this is what you need:

function hexToRGB(hex) {
  return [(hex>>16)&255, (hex>>8)&255, hex&255].join(', ');
function setBColor(id, Bclr, opa) {
  const rgb = hexToRGB('0x' + Bclr);
  document.getElementById("txt" + id).style.backgroundColor = "rgba(" + rgb + ", " + opa + ")";


setBColor('Footer', 'AA0099', 0.75);
setBColor('Header', 'FFFFFF', 1);

comments powered by Disqus