background color - How to use CSS to retrieve a text input by a user -

i have input tags text field, wondering how take input text user entered , displayed in css

this may see odd color background option (#ffffff) designer have access input own color , once hit save, added body background style.

i managed have css pick uploaded image through liquid, don't know how retentive input text color code. i using .liquid through shopify

my css:

 body {     background:{% if settings.use_site_background %}url('site_background.jpg'){% endif %} no-repeat /////this need color code/////// fixed top right;  } 

my settings:

 <tr>   <td><label for="background_color">background color</label></td>   <td><strong>#</strong><input name="background_color" value="" id="background_color" type="text" maxlength="6" /></td>  </tr> 

if there easier way this, appreciate , appreciated!

you'd value of text field follows:

var inputcolor = document.getelementbyid('background_color').value 

and, use wherever need in script

the complete script:

var btn = document.getelementbyid('pickcolor'); btn.addeventlistener('click', pickcolorfunc, false); function pickcolorfunc(){     var inputcolor = document.getelementbyid('background_color').value,         mycontainer = document.getelementbyid('content-box');     mycontainer.style.backgroundcolor = inputcolor; } 

the html:

<input type="text" id="background_color" /> <button id="pickcolor">pick color</button> <div id="content-box"> </div> 

and little css added default ensure background color seen:

#content-box{     width:100px;     height:100px; } 

please check piece of code: http://jsfiddle.net/h5w6j/1