michael-d
9/11/2017 - 1:05 AM

Simple drop down form

Simple drop down form

<!----- DROP DOWN HTML ---->

<div id="enquire-dropdown">
<div class="mceNonEditable">
<form action="/havealook/servlet/Havealook" method="post" name="form3" onsubmit="return validate2()">
<input type="hidden" name="screen" value="emailForm" />
<input type="hidden" name="mailTo" value="EMAILADDRESS" />
<input type="hidden" name="returnTo" value="/thank-you.html" />
<input type="hidden" name="showAll" value="false" />
<div id="enquiry">
<div class="enqHeader">Online Enquiry</div>
<div class="enqRow">
<div class="enqLeft">Name *</div>
<div class="enqRight"><input type="text" name="a_Name" maxlength="250" /></div>
</div>
<div class="enqRow">
<div class="enqLeft">Phone *</div>
<div class="enqRight"><input type="text" name="b_Phone" maxlength="250" /></div>
</div>
<div class="enqRow">
<div class="enqLeft">Email *</div>
<div class="enqRight"><input type="text" name="c_Email" maxlength="250" /></div>
</div>
<div class="enqRow">
<div class="enqLeft">Enquiry</div>
<div class="enqRight"><textarea name="ZZ_Comments"></textarea>
<div>* Required fields</div>
</div>
</div>
<div class="enqRow"><input class="button" type="submit" name="email" value="Send" /></div>
</div>
</form></div>
<br />
<div id="enquire-close" class="enquire-trigger"><span>X</span> Close</div>
</div>
/* -------------------------- */
/* -DROP DOWN ENQUIRY BUTTON- */
/* ------------------------- -*/


#enquire-dropdown {
    position:fixed;
    top:0;
    z-index:10000;
    padding:5px;
    left:50%;
    margin-left:-150px;
	display:none;
	width:300px;
	background:#fff;
	border-radius:0px;
border:1px solid #f1f1f1;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

#enquire-dropdown #enquiry{
background:none;
width:100%;
}



#enquire-dropdown #enquiry input, 
#enquire-dropdown #enquiry textarea {
border:1px solid rgba(0,0,0,.1)
}

#enquire-button {
	position:fixed;
	top:0px;
	left:50%;
	margin-left:110px;
	z-index:1000;
	cursor:pointer;
}


#enquire-button:hover {
	opacity:.8;
	filter: alpha(opacity=80);
}
#enquire-close {
    cursor:pointer;
    margin-left:10px;
    font-size:13px;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}


#enquire-close span {
    font-size:19px;
    font-weight:bold;
    margin-right:5px;
    
}
#enquire-close:hover {
	opacity:.7;
	filter: alpha(opacity=70);
}