We Recommend

Pro JavaScript Techniques Pro JavaScript Techniques
Pro JavaScript Techniques is the ultimate JavaScript book for the modern web developer. It provides everything you need to know about modern JavaScript, and shows what JavaScript can do for your web sites. This book doesn't waste any time looking at things you already know, like basic syntax and structures.


Posted By

alvaroisorna on 09/04/07


Tagged

css js prototypejs


Versions (?)


Who likes this?

1 person has marked this snippet as a favorite

heinz1959


Javascript dynamic effects library for css & html


Published in: JavaScript 


URL: http://kaedatorum.net/blog/

This js library will help you add dynamic effects to your html tags. It's recommended for IE, as it helps you to simulate tag:hover effects for example.


  1. /**
  2.  * @author alvaro isorna
  3.  * @projectDescription dynamic effects library for css & html
  4.  * @id dfx.js
  5.  * @extends prototype.js
  6.  * @use add a "dfx" className to your tags, in order to apply the dynamic effects
  7.  */
  8.  
  9. Event.observe(window, 'load', function(e){
  10. // dfx:hover
  11. $A(document.getElementsByClassName('dfx:hover')).each(function(poElement){
  12. Event.observe(poElement, 'mouseover', function(e){
  13. Element.addClassName(poElement, 'hover');
  14. }, false);
  15. Event.observe(poElement, 'mouseout', function(e){
  16. Element.removeClassName(poElement, 'hover');
  17. }, false);
  18. });
  19. // add any other "dfx" effects (:focus, :first, ...)
  20. // dfx:quotes
  21. $A(document.getElementsByClassName('dfx:quotes')).each(function(poElement){
  22. var cHTML_OPEN_QUOTE = '<span class="open-quote">&ldquo;</span>';
  23. var cHTML_CLOSE_QUOTE = '<span class="close-quote">&rdquo;</span>';
  24.  
  25. new Insertion.Top(poElement, cHTML_OPEN_QUOTE);
  26. new Insertion.Bottom(poElement, cHTML_CLOSE_QUOTE);
  27. });
  28. }, false);

Report this snippet 

You need to login to post a comment.