Controls not showing on videos

[SebCorbin]

I'm reproducing the mixed gallery example from the demo. When navigating to videos the controls don't appear on the youtube videos, is there a workaround?

[timint]

Correct me if I'm wrong. This is not always possible depending on the graphics card and rendering method. As some methods tends to display the video as an overlay layer above the desktop layer. I recall having this issue back in the days with the Windows Media Player browser plugin.

Other than that it should be possible by just positioning the video container relatively. And define the navigation controls after the video content.

[SebCorbin]

Well I could come up with a solution where controls would be on each side of the video, instead of overlaying the whole media, but I have no CSS class to work with to differentiate images from external videos.

[ashleydw]

Actually, this is on purpose as the navigation overlay would cause the video to be unresponsive.

https://github.com/ashleydw/lightbox/issues/102

You could just take this if out https://github.com/ashleydw/lightbox/blob/master/dist/ekko-lightbox.js#L286

[SebCorbin]

For the other persons stumbling on this issue, I did this little bit of css to get the arrows "out of the image/video":

.ekko-lightbox {
  &-container {
    padding: 0 6em;
  }
  .embed-responsive {
    z-index: 200;
  }
  &-nav-overlay {
    z-index: 1;
    display: block !important;
    a {
      &:empty {
        width: 2.8em;
      }
    }
}

but I have a bug on the line-height of links when on a video

I guess it's because this.resize(width); is called before infecting HTML this.lightbox_body.html('<iframe width="' + width + '" height="' + height + '" src="' + this.addTrailingSlash(id) + 'embed/" frameborder="0" allowfullscreen></iframe>');

[ashleydw]

re-reading your issue, when you say controls, do you mean the youtube player controls or the left and right arrows from the lightbox?