Professional ajax popup form
Looking for a nice ajax popup form for your site ?
ajax popup form is a jquery based cool , professional popup window which can be used as contact , feedback … forms on your websites . It’s easy to install and customize .It use ajax to check the email , null fields and use phpmailer to send email .
Online demo
Please go to ajax popup form version 1.0.1 online demo , then click the right bottom contact us image.
Yes , that’s the ajax popup form .
Who use this?
www.caterline.co.uk
frankie.cc
www.dj-marcel-berlin.com
www.brightyoursite.com
How to install
Insert following 3 lines codes between <head> and </head>
<link href="ajaxpopform.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src='jquery-1.4.1.min.js'></script> <script type="text/javascript" src='ajaxpopform.js'></script>
Insert following codes before </body>
<form method="post" id="ajaxpopform" class='ajaxpopform' style="display:none" action="/feedback/post/ajax/" > <div class='ajaxpopformwrapper'> <div class="ajaxpopforminner"> <h2>Contact Us</h2> <p>Professional web design & excellent programming !</p> <fieldset> <label for="help-us-email">Your email address:</label> <div class="field"><input type="text" name="email" id="help-us-email" value="" /></div> </fieldset> <fieldset> <label for="help-us-message">Messages:</label> <div class="field"><textarea id="help-us-message" name="message" cols="20" rows="5"></textarea></div> </fieldset> <div class="rating-module" id="help-us-rateit"> <fieldset> <h4>Please rate your experience for <span>(optional)</span></h4> <div class="rating-inline"> <h5>Services:</h5> <ul class="star-rating"> <li id="shopping-stars" class="current-rating" style="width:0"></li> <li><a href="javascript:;" class="star1" id="shopping-rating-1"><input type="radio" value="1" name="rating_1" id="shopping-rating-input-1"/>1</a></li><li><a href="javascript:;" class="star2" id="shopping-rating-2"><input type="radio" value="2" name="rating_1" id="shopping-rating-input-2"/>2</a></li><li><a href="javascript:;" class="star3" id="shopping-rating-3"><input type="radio" value="3" name="rating_1" id="shopping-rating-input-3"/>3</a></li><li><a href="javascript:;" class="star4" id="shopping-rating-4"><input type="radio" value="4" name="rating_1" id="shopping-rating-input-4"/>4</a></li><li><a href="javascript:;" class="star5" id="shopping-rating-5"><input type="radio" value="5" name="rating_1" id="shopping-rating-input-5"/>5</a></li> </ul> </div> <div class="rating-inline"> <h5>Tools:</h5> <ul class="star-rating"> <li id="creating-stars" class="current-rating" style="width:0"></li> <li><a href="javascript:;" class="star1" id="creating-rating-1"><input type="radio" value="1" name="rating_2" id="creating-rating-input-1"/>1</a></li><li><a href="javascript:;" class="star2" id="creating-rating-2"><input type="radio" value="2" name="rating_2" id="creating-rating-input-2"/>2</a></li><li><a href="javascript:;" class="star3" id="creating-rating-3"><input type="radio" value="3" name="rating_2" id="creating-rating-input-3"/>3</a></li><li><a href="javascript:;" class="star4" id="creating-rating-4"><input type="radio" value="4" name="rating_2" id="creating-rating-input-4"/>4</a></li><li><a href="javascript:;" class="star5" id="creating-rating-5"><input type="radio" value="5" name="rating_2" id="creating-rating-input-5"/>5</a></li> </ul> </div> <div class="rating-inline last"> <h5>Site:</h5> <ul class="star-rating"> <li id="community-stars" class="current-rating" style="width:0"></li> <li><a href="javascript:;" class="star1" id="community-rating-1"><input type="radio" value="1" name="rating_3" id="community-rating-input-1"/>1</a></li><li><a href="javascript:;" class="star2" id="community-rating-2"><input type="radio" value="2" name="rating_3" id="community-rating-input-2"/>2</a></li><li><a href="javascript:;" class="star3" id="community-rating-3"><input type="radio" value="3" name="rating_3" id="community-rating-input-3"/>3</a></li><li><a href="javascript:;" class="star4" id="community-rating-4"><input type="radio" value="4" name="rating_3" id="community-rating-input-4"/>4</a></li><li><a href="javascript:;" class="star5" id="community-rating-5"><input type="radio" value="5" name="rating_3" id="community-rating-input-5"/>5</a></li> </ul> </div> </fieldset> </div> </div> <div class="buttons"> <div class="submit-button"><a class="button form-submit-button"><span class="inner">Send</span></a></div> <a class="button cancel"><span class="inner">Cancel</span></a> </div> </div> <!-- Toggle and show this on success --> <div style="display:none" id="ajaxpopform-success"> <div class="inner"> <h2>Thank you</h2> <h4>Appreciate you taking time to contact us and will reply to your as soon as possible.</h4> </div> <div class="buttons"> <a class="button cancel"><span class="inner">Close</span></a> </div> </div> </form> <div id="ajaxformbtn"> <a class="popup-button" > <img src="images/contact.png" alt="contact us" /> </a> </div>
Put the contact.php at the root of the your site , then open ajaxpopform.js , find those codes
url: “http://www.brightyoursite.com/contact.php”
those should change http://www.brightyoursite.com/ to your domain and point to where the contact.php located !! That’s all enjoy it!!!
Need customize it?
If you have problems with install or customize it , just contact me , i will help you for a very lower reasonable fee .
Donate
if you find it usefull for you and like it very much , please make a
to help me to improve it .
Thanks very much.
Download
, I'm a freelancer and available now,if need help just contact me without hesitation.
58 Responses to “Professional ajax popup form”
Leave a Reply
-
Search for:
Categories
- apache (2)
- css xhtml (10)
- html5 (1)
- javascript (3)
- jquery (5)
- magento (3)
- mysql (1)
- php (1)
- SEO Friendly (6)
- Tools (3)
- w3c validation (4)
- Wordpress (4)
This is a great script. Thank you for sharing.
I ran into 1 small problem. My php version was 4.3. and as the script uses json the thank you form did not appear and the verification was not working eather, allthough the form was send perfectly.
After adding json it worked like a breeze!
I tottally disagree with the post, but as someone at another site said, win some, loose some, even if its a simple task.
“*” I am very thankful to this topic because it really gives great information -’:
I got what you mean , Professional ajax popup form birghtyoursite saved to fav, very nice website .
I like this web blog very much so much superb info .
I merely must let you know which you have written an excellent and exclusive post that I genuinely enjoyed reading. I am fascinated by how effectively you laid out your material and presented your views. Thank you.
Thank you for this wonderful webpage!