Trying to add a "ghost" text in a input form with javascript
<p>I found something i like on Tumbler and tried to recreate it.. but i have a problem.</p>

<p>this is what im trying to clone:
<a href="http://cl.vc/Beta/Tumbler/" rel="nofollow">http://cl.vc/Beta/Tumbler/</a></p>

<p>and this is what i have:
<a href="http://cl.vc/Beta/Tumbler/test.html" rel="nofollow">http://cl.vc/Beta/Tumbler/test.html</a></p>

<p>HTML:</p>

<pre><code>&lt;form method="post" name="form" id="form"&gt; 
&lt;span id="myText"&gt;&lt;p hidden&gt;good&lt;/p&gt;&lt;/span&gt; 
&lt;input type="text" id="input" name="input" value="" onkeypress="showtext();"/&gt; 
</code></pre>

<p>JavaScript: </p>

<pre><code>function showtext() {
    var inputlength = document.getElementById('input').value.length;
    var string = "";

    for (var i = 0; i &lt;= inputlength; i++) {
        var string = string + "&amp;nbsp;";
    }

    document.getElementById('myText').innerHTML = string + "cl.vc";
    document.getElementById('myText').style.zIndex = "2";
}
</code></pre>

<p>the problem is that the space is not the same as if you type in hhhhh or iiiiii because the size of the letter is different.. i also would like if to take away the space if you delete the text..</p>
