ng-gallery not overlaying the whole page

Question

In an Angular project, I'm using a v-Accordion and inside one of its panes, there's a ng-gallery component. Everytime a thumbnail is clicked, the ng-gallery overlay is opened inside the v-Accordion pane. How can I make it fullscreen (covering the body)?

Here is a Plunker demonstrating this issue:

  <h2>Outside Accordion</h2>
  <ng-gallery images="images"></ng-gallery>
  <br />
  <h2>Inside Accordion</h2>
  <v-accordion class="vAccordion--default" multiple>
    <v-pane expanded>
      <v-pane-header>
        Accordion
      </v-pane-header>

      <v-pane-content style="background-color:#dedede;">
        <pre>
          Content bla bla bla
          More Content
        </pre>
        <ng-gallery images="images"></ng-gallery>
      </v-pane-content>
    </v-pane>

  </v-accordion>

https://plnkr.co/edit/V7BfPcRvpkwssOajC34X?p=preview

The reason it's not covering the body is v-Accordions CSS (translate3d) and this: http://stackoverflow.com/questions/15194313/webkit-css-transform3d-position-fixed-issue — tasseKATT, Jan 10 '16 at 12:52

score 0 · Accepted Answer · answered May 19 '16 at 15:07

0

This got fixed with vAccordion v1.5.1 :)

answered May 19 '16 at 15:07

Padlite

125
6

ng-gallery not overlaying the whole page

1 Answers1