Bagaimana cara mengubah lebar video.js pada perubahan Orientasi?

Saya memiliki sejumlah N video, saya memutar semua video melalui kerangka pemutar video.js.

Saya mengatur lebar videoPlayer menggunakan javascript.

Lebar video pertama disetel dengan benar pada mode potret dan lanskap, namun video berikutnya tidak disetel dengan benar dalam mode lanskap.

Ini adalah player.html saya

<video  id="cdnvideo" class="video-js fullscreen vjs-default-skin vjs-big-play-centered" controls preload="auto"
  poster="{{video|videourlfilter}}"  >
<source   src="{{video|videourlfilter}}" type='video/mp4'>    
<source   src="{{video|videourlfilter}}"".mp4" type='video/mp4'>
</video>

My js

 vidPlayer = videojs(document.getElementById('cdnvideo'))
    vidPlayer.width(screen.width)
  $(window).on("orientationchange", function (event) {   
     if(screen.width > screen.height){
         vidPlayer.width(height)
     }
         else{
             vidPlayer.width(width)
         }
});

node.js javascript html video.js orientation
person akash    schedule 21.05.2018    source sumber
comment
Berikut pengkodean pertanyaan serupa...apakah itu membantu sama sekali? stackoverflow.com/questions/5284878 Selain itu, harap sebutkan platform seluler mana yang Anda targetkan saat menguji.   -  person Dave    schedule 21.05.2018
comment
Saya perhatikan bahwa sintaks atribut src tag sumber ke-2 terlihat aneh. yaitu dua tanda kutip ganda yang berdekatan terlihat mencurigakan, dan tidak simetris dengan tag sumber pertama.   -  person Dave    schedule 21.05.2018
comment
Terakhir, javascript itu sendiri tidak diuraikan dengan benar. Petunjuk: mis. Di browser Chrome, navigasikan ke '3-titik-vertikal' -› Alat lainnya -› Alat Pengembang, yang akan mengaktifkan 'konsol' debugging di bagian kanan layar.   -  person Dave    schedule 21.05.2018
comment
Permintaan maaf saya yang tulus...sekarang malam ini, JS Anda TIDAK diurai dengan baik. (Dan, template Anda pada tag sumber ke-2 pasti tidak menampilkan garis miring terbalik, karena dipotong/ditempel atau apa pun.) Tapi, saya sudah belajar banyak, jadi saya akan mencoba sekali lagi. Anda mungkin menemukan beberapa bug di video-js. Untuk mencoba mereproduksinya, tidak jelas bagaimana Anda memvariasikan yang mana dari dua tag sumber yang akan digunakan pengujian Anda? Apakah Anda hanya menukar urutannya, secara berurutan? Atau sesuatu yang lain?   -  person Dave    schedule 22.05.2018

Jawaban (1)


arrow_upward
0
arrow_downward

Tidak, saya benar pertama kali...JS Anda TIDAK diurai dengan benar.

(Saya lupa bahwa satu-satunya kode JS yang diurai adalah kode yang DIEKSEKUSI! Ergo, kode kejadian tidak diurai di laptop Win-10 saya...itu hanya diurai ketika perangkat seluler benar-benar diputar. )

Jadi, dua 'kumpulan' if dan else bersyarat Anda tidak diurai...yaitu. yang pertama mendapatkan: "Referensi Tidak Tertangkap: tinggi tidak ditentukan"

Anda harus menambahkan 'layar'. untuk argumen Anda. misalnya vidPlayer.width(layar.tinggi)

Saya juga salah memahami apa yang Anda maksud ketika Anda mengatakan '... set video pertama' dan '... tapi video berikutnya'. (Saya salah menganggapnya sebagai referensi ke 'grup/kumpulan' file video.)

Bagaimanapun, terima kasih atas pertanyaan Anda...Saya belajar BANYAK dari bermain dengannya. Saya bahkan mendapat penyegaran tentang 'templat' JS saat saya memindai https://www.joezimjs.com/javascript/javascript-templating-adding-html-the-right-way/ (Saya bermain dengan Angular hanya satu atau dua bulan, sebelum saya memutuskan bahwa itu adalah berlebihan untuk kebutuhan 'aplikasi web sebagai hobi' saya. Satu-satunya hal yang harus saya tunjukkan untuk itu, adalah carousel multi-item...misalnya https://mdbootstrap.com/angular/advanced/carousel/ )

Bersulang...

person Dave    schedule 22.05.2018