1 Reply Latest reply on Jul 24, 2011 5:52 PM by Nick Belaevski

    modalpanel transparent background problem

    chung siu man Newbie

      Hi,

       

      I want the popup modal panel, show a spinning gif with background transparent.

      With below script, it works for iE 7, 8, Firefox and Opera browsers.

       

      But below script do not works in IE 6. I found the popup modal panel shows a WHITE background first

      and then overlap with a transparent bacground.

       

      So, can anyone help me to solve above problem.

       

      Thanks

       

      =======================================================

       

      <a:commandLink        

           style="color:black"

           ajaxSingle="true"

           onclick="Richfaces.showModalPanel('ocWaitPanel');  "

      ..

      ..

      </a>

       

      ..

      ..

       

      <html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:rich="http://richfaces.org/rich">
      <head>
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
      <title>Test</title>

      <STYLE TYPE="text/css">

      .rich-modalpanel {background-color: transparent; border-color: transparent; border-width: 0px}

      .rich-mpnl-mask-div {background-color: transparent; border-color: transparent; border-width: 0px}

      .rich-mpnl-resizer {background-color: transparent; border-color: transparent; border-width: 0px}

      .rich-mpnl_panel {background-color: transparent; border-color: transparent; border-width: 0px}

      .rich-mpnl-shadow {background-color: transparent; border-color: transparent; border-width: 0px}

      .rich-mp-content {background-color: transparent; border-color: transparent; border-width: 0px}

      .rich-xxmpnl-body {background-color: transparent; border-color: transparent; border-width: 0px}

      </STYLE>

      </head>


      <body>

      <h:form>

      <rich:modalPanel id="'ocWaitPanel" autosized="true">
      <img src="../../img/ico_loading_01.gif" />

      </rich:modalPanel>
      </h:form>
      </body>

      </html>