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
this plugin have big problems,stop download now, will create an supper ajax popup form shortly.
, I'm a freelancer and available now,if need help just contact me without hesitation.
10 Responses to “Professional ajax popup form”
Leave a Reply
-
Search for:
-
Sponsor
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)
nice work , added it to my own site ,thanks for your work
heya terrific little web page you have right here
I am using the exact design template on my own yet unfortunately for whatever silly reason why it appears to reload earlier on your site eventhough this blog is carrying much more multimedia. Are you implementing any kind of plug ins or widgets that speed it up? Do you think you might be able to reveal the widgets so maybe I would be able to use these in my own internet site so twilight eclipse fans could watch twilight eclipse online trailers and videos more quickly I would be ever so grateful – cheers ahead of time 
sorry，i just recheck the codes and find a problem , the codes in the ajaxpopform.js url: “http://www.brightyoursite.com/contact.php” should change to http://www.brightyoursite.com/ to your domain and point to where the contact.php located
nice share, good
article, very usefull for me…thank you
Hey, I really love the design of your site. What theme are you using?
Hello everyone thanks for
good information.
I enjoyed reading it. I need to read more on this topic..Thanks for sharing a nice info..Any way I am going to subscribe to your feed and I hope you post again soon.
this page was exactly what i have been looking for! found this page bookmarked from a friend. I’ll also share it. thanks!
Advantageously, the post is in reality the sweetest on this worthy topic. I agree with your conclusions and will thirstily look forward to your incoming updates. Just saying thanks will not just be sufficient, for the fantasti c clarity in your writing. I will instantly grab your rss feed to stay privy of any updates. Fabulous work and much success in your business endeavors!
Hi, I’m trying these plugin… where I can find the contact.php file?