Posted By

DavidAspden on 01/15/09


Tagged

corners layout divs nesting


Versions (?)

Layout Helpers


 / Published in: JavaScript
 

Ever want to have content with rounded corners. One technique is to wrap the content inside 4 divs, but this can get messy. If you use prototype you can extend it with these. note the object notational style, build these into a return block!

  1. var Helpers = {
  2. wrap: function(element, tagName, newClassName){
  3. element = $(element);
  4. var wrapper = document.createElement(tagName);
  5. element.parentNode.replaceChild(wrapper, element);
  6. wrapper.addClassName(newClassName);
  7. wrapper.appendChild(element);
  8. return Element.extend(wrapper);
  9. },
  10. fourcorners: function (element, tag){
  11. $w('ltc rtc lbc rbc').reverse().each(function(c){
  12. element = element.wrap(tag,c)
  13. }
  14. );
  15. return Element.extend(element);
  16. },
  17. }
  18. Element.addMethods(Helpers);

Report this snippet  

You need to login to post a comment.