Search code examples
jquerycssjoomlaslimbox

Slimbox - Overlay in front of the image


I've a problem with the Slimbox plugin. When I click over an image, it loads the overlay in front of the image.

Here is an example link: http://immodena.ch/verkaufsangebote/villen/item/38-villa-mit-wohnen-und-arbeiten

I don't understand where is the trouble. I've thought that was a problem with some z-index that overrides the default plugin's stylesheet, but with the inspector I don't see anything in this direction.

Some of you, could tell me what am I doing wrong?


Solution

  • right, finally found the problem.

    You need to add z-index:1; to #lbImage { }

    Then you need to remove z-index:9999; from #lbCenter, #lbBottomContainer { }

    and remove z-index:9998; from #lbOverlay { }

    Hope this helps :)

     #lbImage {
         z-index:1;
     }
    
    div#lbCenter,
    div#lbOverlay,
    div#lbBottomContainer {
        z-index: inherit;
    }