komponent z ReactPlayerem:
import '../style.css';
import React from 'react';
import ReactPlayer from 'react-player';
function VideoSection(){
return(
<section className="video-section">
<div className="overlay"></div>
<ReactPlayer url='upload/video.mp4' playing controls={false} width='100%' height='auto'/>
<div className="home-text-wrapper relative container">
<div className="home-message">
<p>To jest jakiś fajny tekst</p>
<small>To jest jeszcze inny tekst</small>
<div className="btn-wrapper">
<div className="text-center">
<a href="#oferta" className="btn btn-primary wow slideInLeft">Czytaj dalej</a>
</div>
</div>
</div>
</div>
<div className="slider-bottom">
<div id="oferta"></div>
<span>Przeglądaj <div id="popularne"></div><i className="fa fa-angle-down"></i></span>
</div>
</section>
);
}
export default VideoSection;
style:
.video-section {
position: relative;
}
.overlay {
position: absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
z-index: 1;
background: url('../public/images/pattern.png') repeat center center rgba(0, 0, 0, 0.7);
}
I o co chodzi? Chodzi o to, że wideo się wyświetla, ale nie odtwarza filmu. Ten overlay to jest taka nakładka na film, żeby był ciemniejszy. Celowo też
wyłączyłem kontrolki bo ten film ma się odtwarzać od momentu otwarcia strony.
I pytanie, czy o czymś zapomniałem?