5 Replies Latest reply on May 27, 2011 11:19 AM by snaker

    Problem with tag h:graphicImage and background-image in the styleClass

    devilqp

      Hi guys,

      I have a problem with images in my application.

      When I put on my page text.xhtml

      <h:graphicImage id="test" styleClass="imgOK" />
      

       

      where

       

      . imgOK {
      background-image: url (.. / img / tik.gif);
      background-repeat: no-repeat;
      width: 50px;
      height: 50px;
      }
      

       

      I get this result:

      problem.JPG

      but if I insert the url in the attribute like this

      <h:graphicImage id="test" value="img/tik.gif" />
      

      everything works

      tik.gif

      I discovered that the problem occurs only with the tag <h:graphicImage> or <img>

      everything works with the <div> or a <rich:modalPanel> with the attribute class and styleClass and background-image.

       

      why?!?!?

      a bug of RichFaces?

      I'm developing under Webspheare Application server 6.1 Jsf 1.1 and Richfaces 3.1.6 G.A

      and Internet Explorer 8 but the same problem occurs on Google Chrome

        • 1. Re: Problem with tag h:graphicImage and background-image in the styleClass
          snaker

          if you try put ".. / img / tik.gif" with the attribute url? can you see the image of this way:

          <h:graphicImage url="".. /img/tik.gif">

           

           

          • 2. Re: Problem with tag h:graphicImage and background-image in the styleClass
            devilqp

            Hi Gil,

            thanks for your quick response.

            Sorry I misspelled the post I have now corrected

            However it works well

            <h:graphicImage url="".. /img/tik.gif">

            but I do not think the best solution because this picture is repeated several times


            • 3. Re: Problem with tag h:graphicImage and background-image in the styleClass
              snaker

              How is repeat several times?? is normal that if you use graphicImage, is a component and it try load a image, and it not found and this is the reason that show symbol "x".

               

              You only are put background-image, but only background, is not the image that always try load the component

               

              why dont you use a div?? whats is the problem?

               

              Sorry for my english, is very bad

              • 4. Re: Problem with tag h:graphicImage and background-image in the styleClass
                devilqp

                Kike Gil ha scritto:

                 

                How is repeat several times?? is normal that if you use graphicImage, is a component and it try load a image, and it not found and this is the reason that show symbol "x".

                 

                You only are put background-image, but only background, is not the image that always try load the component

                 

                why dont you use a div?? whats is the problem?

                 

                Sorry for my english, is very bad

                the problem is not loading the image because the image is loaded correctly

                If you see in the first picture I posted the image is there and you see is behind the red cross

                It's a very strange problem!!!

                 

                Yes I can use a <div class="blabla"> </div> but why don't works with the tag <img> ?

                This is only my problem or a bug?

                In addition I've this code

                <div align="center">
                    <h:graphicImage styleClass="imgOK" rendered="#{   pc_VerificaVersamenti.okImpEdInt}" />
                    <h:graphicImage styleClass="imgKO" rendered="#{ ! pc_VerificaVersamenti.okImpEdInt}"  />
                </div>
                

                where an image is exclusive of the other image

                this is a reason to use the tag h:graphicImage

                 

                P.S: don't worry for your English... I use google translate

                Thanks for the help



                 




                • 5. Re: Problem with tag h:graphicImage and background-image in the styleClass
                  snaker

                  i have tried these cases:

                  <style>

                       .imageClass{

                            background-image: url('../../Images/icons/edit.png');

                       }

                  </style>

                  <div class="imageClass"></div>

                  <img  class="imageClass"/>

                  <h:graphicImage styleClass="imageClass"/>

                   

                  in the tree cases show the image,  but only div do good, the rest show a symbol X.

                  I think, img or graphicImage need load the image by src or url, otherwise doesn't work