Adding background image in a HTML Form through Javascript

It is an easy task to add background image to a HTML form. But i wanted to hide this feature in a javascript, so that only a person running the form will see that background image and nobody can copy-paste my form based application into his website without my background. I have seen people coping my scripts, so i started to use JS obfuscator (that is another story). Here i will tell you how you can add the background image code inside a javascript.


<form id="demo" style="background-image:url('imageurl.jpg')">
</form> 

Above code is normal, as everybody uses it. The code given below will implement background in function in javascript.

<form id="demo">
<div id="demodiv"><input type=button value="Demo" onclick=demo() /></div>
</form>
<script type='text/javascript'>
function demo()
{
 var urlString = "url('imageurl.jpg')";
 document.getElementById('demo').style.backgroundImage=urlString;
 document.getElementById('demodiv').innerHTML="<h2>Enter your Name : <input type=text size=10 name=name /><br /><br />Enter your Age : <input type=text size=10 name=age /><br /><br />Enter your Gender : <input type=text size=10 name=gender /><br /><br />";
}
</script>

The above code puts the image url inside a javascript function and connects it to form by using getElementById function. Running version of above script is shown below. Try it yourself.

As you click on the DEMO button, a form will display with a background displaying "Bestrix.blogspot.com by Prixit Parashar".