# Can not play video when using VideoTexture

**URL:** <https://discourse.threejs.org/t/can-not-play-video-when-using-videotexture/31280>\
**Category:** Questions\
**Tags:** textures\
**Created:** [October 29, 2021, 1:21pm UTC](https://discourse.threejs.org/t/can-not-play-video-when-using-videotexture/31280 "2021-10-29T13:21:24Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![Bipolab-eu](https://avatars.discourse-cdn.com/v4/letter/b/df788c/32.png) [@Bipolab-eu](https://discourse.threejs.org/u/Bipolab-eu)\
**Post date:** [October 29, 2021, 1:21pm UTC](https://discourse.threejs.org/t/can-not-play-video-when-using-videotexture/31280/1 "2021-10-29T13:21:24Z")

</div>

Hello everyone,

I am trying to build a gallery with three.js where images and videos will be displayed.

I have follow the instructions to add videos as textures in three, but it is not working.

I have tried to follow [this example](https://threejs.org/examples/#webgl_materials_video) but I do not get what is wrong, any idea?

Here is where I used the method of VideoTexture:

const video = document.getElementById(‘video-1’)

```
video.play()

for (let i = 0; i < this.query.length; i++) {

  const thumbWidth = this.query[i].thumbnail.width || 2200

  const thumbHeight = this.query[i].thumbnail.height || 1500

  const thumbTitle = this.query[i].titulo

  const geometry = new THREE.PlaneGeometry(thumbWidth / 6, thumbHeight / 6)

  const texture = this.query[i].thumbnail.ext === '.mp4' ? new THREE.VideoTexture(video) : new THREE.TextureLoader().load(this.query[i].thumbnail.url)

  const material = new THREE.MeshBasicMaterial({ side: THREE.DoubleSide, map: texture, name: thumbTitle, color: '0x000088' })

  const mesh = new THREE.Mesh(geometry, material)
 
  ...

```

}

Thank you very much in advance.
