Hybrid View

  1. #1
    Ext User
    Join Date
    Jul 2009
    Posts
    21
    Vote Rating
    0
    JoeStar is on a distinguished road

      0  

    Default Modal Window Background Transparency

    Modal Window Background Transparency


    Hi All,
    I have a Window that I am using as a Modal Popup. What is the best way to alter the transparency of the modal background css, ie -> I want to make it less transparent. Can you configure this in the JS or do I have to go through the CSS manually.

    By the background I am referring to the grey layer that is brought up behind a modal window when it is opened.

    Thanks in advance.

  2. #2
    Ext JS Premium Member
    Join Date
    May 2007
    Posts
    698
    Vote Rating
    3
    danh2000 is on a distinguished road

      0  

    Default


    It's managed by the css class ext-el-mask

    The default opacity is 0.5 meaning 50%.

  3. #3
    Ext User
    Join Date
    Jul 2009
    Posts
    21
    Vote Rating
    0
    JoeStar is on a distinguished road

      0  

    Default


    Thanks Danh.

    So I manually alter the ExtJS css file is this correct? I was hoping that I could alter this within the JS library but couldn't find anything in the API, as I would prefer not to alter the ExtJS files as these changes will be lost if I ever upgrade to a lter version, but I guess that is only a small concern.

    Thanks.

  4. #4
    Ext JS Premium Member
    Join Date
    May 2007
    Posts
    698
    Vote Rating
    3
    danh2000 is on a distinguished road

      1  

    Default


    Quote Originally Posted by JoeStar View Post
    Thanks Danh.

    So I manually alter the ExtJS css file is this correct? I was hoping that I could alter this within the JS library but couldn't find anything in the API, as I would prefer not to alter the ExtJS files as these changes will be lost if I ever upgrade to a lter version, but I guess that is only a small concern.

    Thanks.
    No, create your own ext-overrides.css file and include this after the ext-all.css file - inside the file put something like:

    Code:
    .ext-el-mask {
        opacity: 0.2; //for instance
    }
    HTH

  5. #5
    Ext User
    Join Date
    Jul 2009
    Posts
    21
    Vote Rating
    0
    JoeStar is on a distinguished road

      0  

    Default


    Right...

    Yep that makes sense!!

    Thanks, you have been super helpful!

Thread Participants: 1