Problemas com um formulário

[marcelrizzo 0]

Galera, eu estou usando este formulário mas as palavras ficam escondidas quando se retira da seleção.

 

Este é o link para ver ele on-line.

 

Eu acho que é algo relacionado com o CSS, mas não sei resolver. Já fiz uns testes mas todos sem sucesso.

 

Valeu!

 

Estão aqui os códigos.

 

DO formulário.

<form class="form" action="form.php" method="get" id="form" name="form" title="Sample Request" onsubmit="return valida()">                <fieldset><legend style="display:none">Forms Camp</legend>                                <label for="name" class="box">Name:</label>                <input type="text" class="campo1" name="name" id="name" alt="Name" title="Name" onfocus="this.className='campo_focus'" onblur="this.className='campo1'" />                                <label for="email" class="box">E-mail:</label>                <input type="text" class="campo1" name="email" id="email" alt="Email" title="Email" onfocus="this.className='campo_focus'" onblur="this.className='campo1'" />                                <label for="company" class="box">Company:</label>                <input type="text" class="campo1" name="company" id="company" alt="Company" title="Company" onfocus="this.className='campo_focus'" onblur="this.className='campo1'" />                                <label for="address" class="box">Address:</label>                <input type="text" class="campo1" name="address" id="address" alt="Address" title="Address" onfocus="this.className='campo_focus'" onblur="this.className='campo1'" />                                <label for="sample" class="box">Which sample do you need?</label>                Catalogue 1 <input type="radio" class="sample" name="catalogue" value="catalogue" alt="Catalogue" title="Catalogue" checked/>                 Catalogue 2 <input type="radio" class="sample" name="catalogue" value="catalogue2" alt="Catalogue2" title="Catalogue2"/>                                                 <label for="details" class="box2">Details:</label>                                <textarea name="details" cols="" rows="" class="message" id="details" title="Details" onfocus="this.className='message_focus'" onblur="this.className='message'"></textarea>                </fieldset>                <fieldset><legend style="display:none">Sending Tabs</legend>                <input name="enviar" type="submit" id="enviar" value="Send" alt="Send" title="Send" class="send" onmouseover="this.className='send_over'" onmouseout="this.className='send'" />                <input name="clear" type="reset" id="clear" value="Clear" alt="Clear" title="Clear" class="send" onmouseover="this.className='send_over2'" onmouseout="this.className='send'" />                </fieldset>                </form>

Da validação JS

 

document.form.name.focus();

 

return false;

 

}

 

 

 

if (document.form.email.value==""){

 

alert('Complete this option');

 

document.form.email.focus();

 

return false;

 

}

 

 

 

if (document.form.company.value==""){

 

alert('Complete this option');

 

document.form.company.focus();

 

return false;

 

}

 

 

 

if (document.form.address.value==""){

 

alert('Complete this option');

 

document.form.address.focus();

 

return false;

 

}

 

 

if (document.form.sample.value==""){

 

alert('Complete this option');

 

document.form.sample.focus();

 

return false;

 

}

 

 

if (document.form.details.value==""){

 

alert('Complete this option');

 

document.form.details.focus();

 

return false;

 

}

 

 

 

parte1 = document.form.email.value.indexOf("@");

 

parte2 = document.form.email.value.indexOf(".");

 

parte3 = document.form.email.value.length;

 

if (!(parte1 >= 3 && parte2 >= 6 && parte3 >= 9)) {

 

alert ("Use a valid E-mail Ex. _linenums:0'>function valida(){if (document.form.name.value==""){ alert('Complete this option'); document.form.name.focus(); return false;}if (document.form.email.value==""){ alert('Complete this option'); document.form.email.focus(); return false;}if (document.form.company.value==""){ alert('Complete this option'); document.form.company.focus(); return false;}if (document.form.address.value==""){ alert('Complete this option'); document.form.address.focus(); return false;}if (document.form.sample.value==""){ alert('Complete this option'); document.form.sample.focus(); return false;}if (document.form.details.value==""){ alert('Complete this option'); document.form.details.focus(); return false;} parte1 = document.form.email.value.indexOf("@"); parte2 = document.form.email.value.indexOf("."); parte3 = document.form.email.value.length;if (!(parte1 >= 3 && parte2 >= 6 && parte3 >= 9)) {alert ("Use a valid E-mail Ex.: yourname@exemple.com");document.form.email.focus();return false;}}

 

E o CSS:

.color {	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 10px;	color: #004BC8;	background-color: #000000;	margin-left: 15px;}.color2 {	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 9px;	color: #757575;	font-style: normal;	font-weight: bold;	font-variant: normal;	text-decoration: none;	background-color: #F0F0F0;	padding-left: 4px;}.color3 {	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 10px;	color: #004BC8;	background-color: #FFFFFF;	margin-left: 2px;}form.form {	clear: both;	float: left;	height: auto;	width: 455px;	margin-top: 10px;	margin-bottom: 20px;}fieldset, legend {	margin: 0px;	position: relative;	border-top-style: none;	border-right-style: none;	border-bottom-style: none;	border-left-style: none;	height: auto;	width: auto;}label.box {	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 10px;	color: #000;	text-align: left;	clear: left;		float: left;		padding: 3px 0px 3px 10px;	height: auto;	width: 80px;	margin-bottom: 3px;	background-color: #FFFFFF;}label.box2 {	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 10px;	color: #000;	text-align: left;	clear: left;		float: left;	height: 130px;	width: 80px;	margin-bottom: 6px;	background-color: #fff;	line-height: 110px;	padding: 3px 0px 3px 10px;}input.campo1 {	clear: none;	float: left;	height: auto;	width: 340px;	text-align: left;	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 10px;	color: #ffffff;	border: 1px solid #CCCC33;	margin-bottom: 3px;	padding: 2px 0px 2px 2px;}input.campo2 {	clear: none;	float: left;	height: auto;	width: 150px;	text-align: left;	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 10px;	color: #ffffff;	border: 1px solid #CCCC33;	margin-bottom: 3px;	margin-right: 2px;	padding: 2px 0px 2px 2px;}input.campo3 {	clear: none;	float: left;	height: auto;	width: 200px;	text-align: left;	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 10px;	color: #ffffff;	border: 1px solid #CCCC33;	margin-bottom: 3px;	padding: 2px 0px 2px 2px;}input.campo_focus {	clear: none;	float: left;	height: auto;	width: 340px;	text-align: left;	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 10px;	color: #000000;	border: 1px solid #000;	padding: 2px 0px 2px 2px;	margin-bottom: 3px;	background-color: #F5F5FA;}input.campo_focus2 {	clear: none;	float: left;	height: auto;	width: 150px;	text-align: left;	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 10px;	color: #000000;	border: 1px solid #FF3333;	margin-bottom: 3px;	margin-right: 2px;	padding: 2px 0px 2px 2px;	background-color: #F5F5FA;}input.campo_focus3 {	clear: none;	float: left;	height: auto;	width: 200px;	text-align: left;	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 10px;	color: #000000;	border: 1px solid #000;	padding: 2px 0px 2px 2px;	margin-bottom: 3px;	background-color: #F5F5FA;}textarea.message {	clear: none;	float: left;	height: 130px;	width: 340px;	text-align: left;	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 10px;	color: #ffffff;	border: 1px solid #CCCC33;	padding: 2px 0px 2px 2px;	margin-bottom: 6px;	margin-top: 12px;}textarea.message_focus {	clear: none;	float: left;	height: 130px;	width: 340px;	text-align: left;	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 10px;	color: #000000;	border: 1px solid #000;	padding: 2px 0px 2px 2px;	background-color: #F5F5FA;	margin-bottom: 6px;		margin-top: 12px;}input.send {	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 10px;	clear: none;	float: left;	width: auto;	border: 1px solid #7F9DB9;	position: relative;	padding: 1px;	margin: 3px 0px 0px 2px;	background-color: #F0F0F0;	color: #505050;		text-align: center;}input.sample {	margin-top: 2px;		}input.send_over {	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 10px;	clear: none;	float: left;	width: auto;	border: 1px solid #009900;	position: relative;	padding: 1px;	margin: 3px 0px 0px 2px;	background-color: #F6F6F6;	color: #009900;		text-align: center;}input.send_over2 {	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 10px;	clear: none;	float: left;	width: auto;	border: 1px solid #FF6633;	position: relative;	padding: 1px;	margin: 3px 0px 0px 2px;	background-color: #F6F6F6;	color: #FF6633;	text-align: center;}select.color_all {	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 10px;	color: #000000;	text-decoration: none;	border: 1px solid #000000;	clear: none;	float: left;	margin-bottom: 3px;	width: 154px;	border: 1px solid #000000;	padding: 1px 0px 1px 2px;}select.color_all2 {	font-family: Verdana, Arial, Helvetica, sans-serif;	font-size: 10px;	color: #ffffff;	text-decoration: none;	border: 1px solid #000000;	clear: none;	float: left;	margin-bottom: 3px;	width: 45px;	border: 1px solid #000000;	padding: 1px 0px 1px 2px;}

Valeu!

[marcelrizzo 0]

Valeu!Aff, me deu até vergonha agora! hheheheheheFalows