jQuery: Sequential List


/ Published in: jQuery
Save to your folder(s)



Copy this code and paste it in your HTML
  1. <script type="text/javascript" src="jquery.js"></script>
  2.  
  3. <script type="text/javascript">
  4. $(document).ready(function(){
  5.  
  6. $("#step li").each(function (i) {
  7. i = i+1;
  8. $(this).addClass("item" i);
  9. });
  10.  
  11. });
  12. </script>
  13. <style>
  14. #step .item1 {
  15. background: url(step1.png) no-repeat;
  16. }
  17. #step .item2 {
  18. background: url(step2.png) no-repeat;
  19. }
  20. #step .item3 {
  21. background: url(step3.png) no-repeat;
  22. }
  23. <body>
  24. <ol id="step">
  25. <li></li>
  26. <li></li>
  27. <li></li>
  28. </ol>
  29. </body>
  30. </style>

URL: http://www.webdesignerwall.com/tutorials/jquery-sequential-list/

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.