8 Replies Latest reply on May 31, 2011 5:48 AM by Bernard Labno

    Lightbox component

    Bernard Labno Master

      Hello community!

      I've just created lightbox component. It is based on popular jQuery lightbox plugin (http://leandrovieira.com/projects/jquery/lightbox/). If you know better implementations of this cool plugin, please let me know and I may replace current implementation with it.

      Currently it is available for RF 3.3.4-SNAPSHOT but I can migrate it on community demand.

       

      Demo, download and subversion address are here.

       

      Make sure to use default script and style loading strategies.

        • 1. Lightbox component
          Anil Jacob Newbie

          I am getting an error in FB saying 'RichFaces.Lightbox is not a function'.  here is my code. Any help is greatly appreciated.

           

          Thanks

          Anil

           

           

                              <div id="gallery">           

                              <rich:scrollableDataTable rowKeyVar="rkv" height="400px"

                                  width="200px" id="imageList" rows="20" rowClasses="row"

                                  value="#{dataTableScrollerBean.allCars}" var="category"  border="0"

                                  selection="#{dataTableScrollerBean.selection}">

                             

                                  <rich:column id="thumbnail" >

                                          <a href="/richfaces/jQuery/images/1.jpg">

                                              <h:graphicImage value="/richfaces/jQuery/images/1s.jpg"/>

                                          </a>                                                                      

                                  </rich:column>

                              </rich:scrollableDataTable>

                              </div>   

                             

                             <lightbox:lightbox id="lightbox" selector="#gallery a" containerBorderSize="10"

                                 containerResizeSpeed="400" keyToClose="c"

                                 keyToNext="n" keyToPrev="p"

                                 overlayBgColor="#000"

                                 overlayOpacity="0.8" txtImage="Image" txtOf="of"

                                 imageBlank=""

                                 imageBtnClose=""

                                 imageBtnNext=""

                                 imageBtnPrev=""

                                 imageLoading=""

                             />   

          • 2. Lightbox component
            Bernard Labno Master

            Change your script loading strategy to DEFAULT.

            • 3. Lightbox component
              Anil Jacob Newbie

              Thanks Bernard, I changed the loading strategy to DEFAULT and now all the js is getting loaded. But for some reason the images are not getting loaded when I click a thumbnail. The back ground just turs balck and the image loading icon is shown. Is there a war file for your demo application of lightbox?

               

              Thanks

              Anil

              • 5. Lightbox component
                Anil Jacob Newbie

                Thank you!

                • 6. Re: Lightbox component
                  daniel carpio contreras Newbie

                  Hi. I'm currently working with RichFaces 4.0.0 and I would like to use lightbox component. I think it's a very usefull component for displaying images instead of using a dataGrid (like i do ).

                  • 7. Re: Lightbox component
                    Bernard Labno Master

                    I'll have it moved to 4.x tomorrow.

                    • 8. Re: Lightbox component
                      Bernard Labno Master

                      Component migrated to 4.x. See this document.