点击显示表单百分比进度

点击显示表单百分比进度

 

演示

 

 

XML/HTML Code

1. <form id="myform">  
2. <p>  
3. <label for="">Click on a field</label>  
4. <input  data-progression type="text" data-helper="Help users through forms by prividing helpful hinters" name="name" value="" placeholder="">  
5. </p>  
6. <p>  
7. <label for="">Helps provide a better user experience</label>  
8. <input data-progression type="text" data-helper="Tracks users progress when filling in forms" name="email" value="" placeholder="">  
9. </p>  
10. <p class="left">  
11. <label for="">Another Field</label>  
12. <input data-progression type="text" data-helper="The tooltip is fully customisable" name="mytel" value="" placeholder="">  
13. </p>  
14. <p class="right">  
15. <label for="">Another Field</label>  
16. <input data-progression type="text" data-helper="And can be positioned left or right" name="mytel" value="" placeholder="">  
17. </p>  
18. <p>  
19. <label for="">Telephone Number</label>  
20. <textarea data-progression name="" data-helper="Either the helper text or progress bar can be turned off"></textarea>  
21. </p>  
22. <p>  
23. <input type="submit" class="button" name="" value="Lets Go!" placeholder="">  
24. </p>  
25. </form>  

 

原文地址:http://www.freejs.net/article_jquerywenzi_228.html