Implement adaptive zoom positioning of videos on mobile devices

Question

I have the following code: https://codesandbox.io/s/cool-sunset-pe8pgh?file=/src/styles.css

I want to scale a video on mobile devices without losing any video elements, how can I achieve this?

Answer 1

I checked your code. Please set the width for the video component, for example -

<video
      className="razmi-video"
      autoPlay
      loop
      muted
      playsinline="true"
      disablePictureInPicture="true"
      width={100} <--- 在这里设置宽度
    >

Hope you can get the answer, if you still have problems, please tell me and I will help you. Thanks