Saat memutar video di bawah WeChat di iOS dan ponsel Android, Anda akan menghadapi banyak masalah. Jika video itu bukan video tencent, pemutaran akan diputar.
Solusi: Tambahkan beberapa atribut ke video dan hubungi video asli H5.<ID Video = Videoall Src = Video/01.mp4 Poster = Gambar/1.jpg/*视频封面*/preload = Auto WebKit-playsinline = true/*这个属性是 iOS 10 中设置可以让视频在小窗内播放, Yaitu, apakah itu pemutaran layar penuh* / playsinline = true /* IOS WeChat Browser mendukung pemutaran jendela kecil* / x -webkit-airplay = Izinkan X5-video-player-type = H5 /* H5, yang adalah WeChat Android. Nilai adalah layar vertikal*/ style = objek-fils: fill> </dide>Poster = Images/1.jpg: Gambar yang ditampilkan saat atribut menentukan unduhan video, atau gambar yang ditampilkan di depan pengguna klik tombol Putar. Jika atribut ini tidak diatur, gunakan bingkai pertama dari video sebagai gantinya. Preload = auto: Atribut menentukan video setelah halaman dimuat. WebKit-playsinline dan PlaySinline: pemutaran lokal selama pemutaran video, jangan tinggalkan aliran dokumen. Tetapi atribut ini lebih istimewa. Dengan kata lain, jika aplikasi tidak diatur, label ini tidak efektif pada halaman Anda.
Perlu ditambahkan di sini. perlu karena layar penuh default. Tetapi pada saat ini layar penuh telah memainkan kontrol, apakah Anda menetapkan kontrol apakah Anda mengatur. Siaran langsung siaran langsung dapat digunakan, tetapi H5 layar penuh tidak diperlukan, sehingga kontrol kontrol selama pemutaran layar penuh memerlukan pengaturan berikut: pemutaran lapisan yang sama.
X-Webkit-Airplay = Izinkan tidak dapat mengetahui perannya persis untuk saat ini, tetapi Xiaobian berspekulasi bahwa atribut ini harus membuat video ini mendukung fungsi AirPlay iOS. Menggunakan AirPlay dapat memutar video, musik, dan file foto langsung dari berbagai lokasi di perangkat iOS. Pemutaran ini juga mendukung fungsi yang sesuai. X5-Video-Player-Type: Aktifkan pemutar H5 Layer yang sama, yaitu, ketika layar penuh video, Div dapat disajikan pada lapisan video, yang juga merupakan atribut unik dari versi Android WeChat. Mainkan alias pada lapisan yang sama juga disebut pemutaran imersif. Pemain tingkat yang sama saat ini hanya berlaku pada Android (termasuk WeChat) dan tidak mendukung iOS untuk saat ini. Adapun mengapa pemutaran lapisan yang sama hanya terbuka untuk Android, karena Android tidak dapat dimainkan seperti ISO, layar penuh default akan menyebabkan beberapa operasi antarmuka diblokir. Lapisan yang sama saat ini memecahkan masalah ini. Namun, selama tes, ditemukan bahwa berbagai versi efek ISO dan Android sedikit berbeda. X5-Video-Orientation: Menyatakan arah yang didukung oleh pemain, layar horizontal lansekap nilai opsional, layar vertikal potret. Potret nilai default. Baik siaran langsung dan layar penuh H5 umumnya dimainkan layar vertikal, tetapi atribut ini membutuhkan tipe X5-Video-Player untuk membuka mode H5 X5-Video-Player-FullScreen: Pengaturan Layar Penuh. Ini memiliki dua nilai atribut lainnya, Ture dan False, True mendukung pemutaran layar penuh, False tidak mendukung pemutaran layar penuh.Faktanya, browser ISO WeChat adalah inti dari Chrome, dan atribut terkait didukung, dan itulah sebabnya X5 tidak didukung oleh lapisan yang sama. Browser Android WeChat adalah kernel X5.
Ada juga masalah.
Solusi: Tambahkan objek-fit: Isi; Jika masih ada tepi hitam, ukuran video tidak pantas.<Div ID = VideObox> <Video id = Videoall SRC = MP.MP4 POSTER = 1.JPG preload = Auto WebKit-playsinline = true playSinline = true = Izinkan x5-video-player-Type = H5 X5- Video-player-fullscreen = True x5-video-orientation = Portrain Style = Object-Fit: Fill> </ Video> <Div ID = PlayContrR ()> </div> </div> <Div ID = Videoend> <Div ID = LagiTn OnClick = PlayContrR ()> </Div> </div>
*Padding: 0; 100%; Latar belakang -Sise: overflow; : -40.5px; 2. JPG);
<script> var videoall = document.geteLementById ('videoall'), videobox = document.geteLementById ('videobox'), btn = d ('btn'), videond = document.getElementById ('videoEnd'); .docmeentElement.clientwidth; preventdefault ()}, gaya fungsi; .Indexof ('adr')> -1; // terminal android var isios = !! Fungsi Terminal iOS PlayContra () {if (isAndroid) {Videoall.style.width = window.screen. = Videoall.play (); , Function () {VideoAlll .Pause ();Di atas adalah solusi untuk pemutaran html5 WeChat -full -screen yang saya perkenalkan kepada Anda. Terima kasih banyak atas dukungan Anda untuk situs web VEVB Wulin!