Question

I need a HTML form which is created at some place on the screen after the user clicks space button. Of course there is some CSS in the head section. Building the DOM tree is somekind slow and document.write isn’t good decision as I tried. Some code attempt is as follows:

$(document).keydown(function(e){
    if (e.keyCode == 32) { 
            $('<div class="textcontainer"><form><input type="text" name="q" class="text" autocomplete="off"><div id="log"></div></form></div>');
       return false;
    }
    }); 

Answer 1

Place the code wherever you want it to show up in the page. in your styles, put this:

.textcontainer { display: none; }

This allows it to load with the rest of the page. Then, on click, simply set the display to block.

$(document).keydown(function(e){
    if (e.keyCode == 32) { 
            $('.textcontainer').css('display','block');
       return false;
    }
    });