Hello there. I am building my portfolio web-site and for it I need to use a reagistration form . On many web sites I have seen pop up registration forms . For example when you click on register button a form pops up (at the same time you remain in the same page ) and you can fill in the forms and submit . So I mean does javascript or jquery have that type of code that i can integrate to my sites code to get that type of pop form . Thank you in advance!!!
Hi, You can check this HTML: <script> $( function() { $( "#dialog" ).dialog({ autoOpen: false, show: { effect: "blind", duration: 1000 }, hide: { effect: "explode", duration: 1000 } }); $( "#opener" ).on( "click", function() { $( "#dialog" ).dialog( "open" ); }); } ); </script> Thanks
Code: html code: <div id="contact">Enquiry</div> <div id="contactForm"> <small>Let us know how we can assist you, One of Sales person will get back to you shortly.</small> <form action="contact_me.php" method="post" enctype="multipart/form-data"> <label>First Name<span>*</span>:</label> <input name="cfname" type="text" input placeholder=" First-Name" required/> <label>Last Name<span>*</span>:</label> <input name="clname" type="text" input placeholder="Last-Name" required/> <label>Email Address<span>*</span>:</label> <input name="cemail" type="email" input placeholder="Email-id" required /> <label>Brief Subject:</label> <input name="csubject" type="text" input placeholder="subject" /> Enter your message<span>*</span> in the box below: <textarea name="message" cols="" rows=""></textarea> <input class="formBtn" type="submit" /> <input class="formBtn" type="reset" /></form> </div> </div> contact_me.php code: Code: <?php $first_name = $_POST['cfname']; $last_name = $_POST['clname']; $email = $_POST['cemail']; $subject = $_POST['csubject']; $message = $_POST['message']; $mail_to = 'your mail address'; $msg = 'Sales Enquiry from support page '; $body_message .= 'first name: '.$first_name."\n"; $body_message .= 'last name: '.$last_name."\n"; $body_message .= 'Email: '.$email."\n"; $body_message .= 'Message: '.$message."\n"; $body_message .= 'Subject: '.$subject."\n"; $headers = 'From: '.$email."\r\n"; $headers .= 'Reply-To: '.$email."\r\n"; $mail_status = mail($mail_to, $msg, $body_message, $headers ); if ($mail_status) { ?> <script language="javascript" type="text/javascript"> alert('Thank you for submitting the form. We will contact you soon!.'); window.location = 'index.html'; </script> <?php } else { ?> <script language="javascript" type="text/javascript"> alert('Something went wrong. Please try again or contact at myPersonalEmail@email.com'); window.location = 'index.html'; </script> <?php } ?> Code: contact_me.js $(function() { // contact form animations $('#contact').click(function() { $('#contactForm').fadeToggle(); }) $(document).mouseup(function (e) { var container = $("#contactForm"); if (!container.is(e.target) // if the target of the click isn't the container... && container.has(e.target).length === 0) // ... nor a descendant of the container { container.fadeOut(); } }); }); Hope this code helps Thanks!