VideoPlayer in lightning sdk is getting displayed below the rest of tags even after setting zIndex of tag instance

Get Help
1

Backdrop: {
x: 800,
alpha: 0.001,
w: (w) => w,
h: 740,
type: Player,
zIndex: 999,
shader: { type: Lightning.shaders.FadeOut, fade: [0, 700, 900, 0] },
transitions: { alpha: { duration: 1 } },
},

VideoPlayer.consumer(this.tag(“Backdrop”));

→ In the _firstActive (or _init ) lifecycle event, you can pass a reference to the component that should be set as the consumer .

→ seems like this.tag() is not working for consumer in video player
:upside_down_face: VideoPlayer lightning sdk

1 Like
2

Read through this:

The important thing to note is on some devices the Video plays on 0 index and you can’t change that. You have to use a hole punch to cut through the canvas tag to reveal the video playing.

1 Like
3

Thank you for your reply. This helps.

4

You can use the Videoplayer Object to set zIndex. Another way can be to use loader() in Videoplayer which has videoEl property.

export const loader = (url, videoEl, options = {}) => {
    videoEl.style.zIndex = 2
    ...
}
1 Like