input box shading using jQuery

How can I make a shaded background for an input box, as shown here(scroll down a little), using jQuery or CSS?

EDIT: I don't want to use an image as ba开发者_JS百科ckground.

Outer shadow

input {
    -webkit-box-shadow: 0 2px 5px rgba(0,0,0,.3);
    -moz-box-shadow: 0 2px 5px rgba(0,0,0,.3);
    -o-box-shadow: 0 2px 5px rgba(0,0,0,.3);
    box-shadow: 0 2px 5px rgba(0,0,0,.3);
    border:none;
    padding:5px;
}

Inner Shadow

input {
    -webkit-box-shadow:inset 0 2px 5px rgba(0,0,0,.3);
    -moz-box-shadow:inset 0 2px 5px rgba(0,0,0,.3);
    -o-box-shadow:inset 0 2px 5px rgba(0,0,0,.3);
    box-shadow:inset 0 2px 5px rgba(0,0,0,.3);
    border:none;
    padding:5px;
}

Usually that would be a background image so you can set a css class for the text box and use that image in the background-image property.

So I don't think you'd use jQuery in this but then I can't get to the link you have posted.

If you need to set it via jQuery then use the .addClass("classname") jquery method on the object.