Visualforce Lightbox Component


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

Credit to Jonathan Hersh


Copy this code and paste it in your HTML
  1. <!-- AppExchange Link http://sites.force.com/appexchange/listingDetail?listingId=a0N30000001g3u0EAA -->
  2. <!-- Jonathan Hersh - [email protected] - 7/13/2009 -->
  3.  
  4. <apex:component selfclosing="true">
  5. <apex:attribute name="function" description="This is the name of the JS function to call."
  6. type="String" required="true"/>
  7. <apex:attribute name="title" description="This is the title displayed in the lightbox."
  8. type="String" required="true"/>
  9. <apex:attribute name="content" description="This is the HTML content of the lightbox."
  10. type="String" required="true"/>
  11. <apex:attribute name="width" description="This is the width, in pixels, of the lightbox."
  12. type="Integer" required="true"/>
  13. <apex:attribute name="duration" description="This is the duration, in ms, to show the box before it autohides (i.e. 2000ms = 2 sec), or 0 for an untimed box."
  14. type="Integer" required="true"/>
  15.  
  16. <script type="text/javascript">
  17. function {!function}() {
  18. var box = new parent.SimpleDialog("hersh"+Math.random(), true);
  19. parent.box = box;
  20.  
  21. box.setTitle("{!title}");
  22.  
  23. box.createDialog();
  24. box.setWidth({!width});
  25.  
  26. box.setContentInnerHTML("<a href=\"#\" onclick=\"box.hide();\">Close</a><br /><br /><p>{!content}</p>");
  27.  
  28. box.setupDefaultButtons();
  29.  
  30. box.show();
  31.  
  32. if( {!duration} > 0 )
  33. setTimeout("box.hide();",{!duration});
  34. }
  35. </script>
  36. </apex:component>

URL: http://sites.force.com/appexchange/listingDetail?listingId=a0N30000001g3u0EAA

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.