Как я могу добавить видео в карусели с помощью response- bootstrap? - PullRequest
Новая
       3

Как я могу добавить видео в карусели с помощью response- bootstrap?

0 голосов
/ 21 апреля 2020

Я пытаюсь добавить видео в карусель, но не могу добавить его правильно. Я пробовал HTML5 тег видео, но он не работает. Я также использовал iframe, но это не решает мои требования, может кто-нибудь, пожалуйста, скажите мне, как я могу реализовать видео в карусели вместо изображения 

import React, { Component } from "react";
import { Carousel } from "react-bootstrap";
class Slider extends Component {
  render() {
    return (
      <>
       <Carousel>
  <Carousel.Item>
    <img
      className="d-block w-100"
      style={{width:"400px",height:"400px"}}
      src="https://img.rawpixel.com/s3fs-private/rawpixel_images/website_content/pf-mu6-ake6324-chim-l.jpg?w=800&dpr=1&fit=default&crop=default&auto=format&fm=pjpg&q=75&vib=3&con=3&usm=15&bg=F4F4F3&ixlib=js-2.2.1&s=7edc252958c9c6b9cea5379443d6ac46"
      alt="First slide"
    />

  </Carousel.Item>
  <Carousel.Item>
    <img
      className="d-block w-100"
      style={{width:"400px",height:"400px"}}
      src="https://img.rawpixel.com/s3fs-private/rawpixel_images/website_content/pf-mu6-ake6324-chim-l.jpg?w=800&dpr=1&fit=default&crop=default&auto=format&fm=pjpg&q=75&vib=3&con=3&usm=15&bg=F4F4F3&ixlib=js-2.2.1&s=7edc252958c9c6b9cea5379443d6ac46"
      alt="Third slide"
    />


  </Carousel.Item>
  <Carousel.Item>
   <video style ={{width:"400px",height:"400px"}}>
       <source src="https://youtu.be/r0DYJzN00B4" type="video/mp4"></source>
   </video>


  </Carousel.Item>
</Carousel>
      </>
    );
  }
}

export default Slider;
...