...

View Full Version : <input type="text" -- add text in the background



utnalove
06-16-2010, 07:34 PM
Hello...

I have the following field:


<p><input type="text" style="width:140px" name="email"/></p>

<p>
<input type="hidden" value="przepiekna" name="uri"/><input type="hidden" name="loc" value="en_US"/><input type="submit" value="here is my text" />

What should I do in order for a text to appear inside the box, and when the box is clicked, the text disappears?

Scriptet
06-16-2010, 07:41 PM
You can use JavaScript so that onclick of the button you set the CSS for the text to either display:none;/visibility:hidden;/left:-999em;

utnalove
06-16-2010, 07:42 PM
is it an edit to that code, or it should be added somewhere?

P.s. what button you are talking about?

I mean the text box that you see straight under Wpisz swój adres email: in www.przepiekna.pl

conecode
06-16-2010, 07:45 PM
in HTML5 you can use the placeholder attribute. this should work with chrome 4+, safari 4+, and firefox 3.7.


<form>
<input name="q" placeholder="Search Bookmarks and History">
<input type="submit" value="Search">
</form>


here's a link that explains a javascript solution.
http://www.yourhtmlsource.com/forms/clearingdefaulttext.html

utnalove
06-16-2010, 08:01 PM
I don't understand how to make that javascript code... nowere there is written where the clearing text needs to be writter (or I don't get it).

How to use the html that you wrote? Why you wrote about "Search Bookmarks and History" it is completely not related to my case...

Apostropartheid
06-16-2010, 08:37 PM
What is a writter?

It wasn't incredibly hard to find the answer you were looking for on Google:
http://www.siteexperts.com/tips/elements/ts27/page1.asp

utnalove
06-16-2010, 08:53 PM
What is a writter?

It wasn't incredibly hard to find the answer you were looking for on Google:
http://www.siteexperts.com/tips/elements/ts27/page1.asp

Thanks... it just works and it is easy to understand :)

writter is a typo... it had to be "written" :)

Dean440
06-16-2010, 09:03 PM
<!DOCTYPE html>
<html>

<head>
<script type="text/javascript">
function clearText(field){
if(field.value === field.defaultValue){
field.value="";
}
}
function replaceText(field){
if(field.value === ""){
field.value=field.defaultValue;
}
}
</script>
</head>
<body>

<form action="#">
<input onfocus="clearText(this);" onblur="replaceText(this);" type="text" value="First Name" /> <br />
<input onfocus="clearText(this);" onblur="replaceText(this);" type="text" value="Telephone" /> <br />
<input type="submit" value="Submit" />
</form>

</body>
</html>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum