मैं अपने स्थानीय वेबकैम से लाइव सामग्री स्ट्रीम करने के लिए Video.js प्लेयर का उपयोग कर रहा हूं (लेकिन मुझे लगता है कि उस मामले में कोई फर्क नहीं पड़ता है, यह वेब से कोई लाइव स्ट्रीम हो सकता है)। मैं एक बहुत ही सरल कोड लिखा है:वीडियो.जेएस केवल ऑटोप्ले सेट के साथ सत्य पर दिखाता है। क्या मैं इसे प्ले बटन पर क्लिक करने के बाद काम कर सकता हूं?
<head>
<link href="video-js.css" rel="stylesheet">
<script src="http://www.andy-howard.com/js/libs/jquery-1.8.2.min.js"></script>
<script src="http://vjs.zencdn.net/c/video.js"></script>
<link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet">
</style>
</head>
<body>
<video id="video1" class="video-js vjs-default-skin" width="640" height="480" controls="controls"
preload="auto" data-setup='{}' autoplay="true" >
<source src="http://10.172.180.31:8090/live.flv" type="video/x-flv">
</video>
</body>
और अब है कि विन्यास मैं धारा सामग्री को देखने में, लेकिन वहाँ जोड़ी त्रुटियाँ हैं:
1) मैं नियंत्रण दिखाई नहीं देते (धारा को रोकने के लिए)
2) स्ट्रीम this जैसा दिखता है, इसलिए वीडियो को घटक के पूर्ण आकार में आकार में नहीं बदला गया है। लेकिन (और यह वास्तव में दिलचस्प है) जब मैं वेबपृष्ठ पर तत्वों का आकार बदलता हूं (उदाहरण के लिए क्रोम में नियंत्रण और माउस व्हील स्क्रॉल करके) 110% तक, तो वीडियो पूरे घटक को भरता है। वीडियो.जेएस में एक बग की तरह लगता है या शायद मेरा कार्यान्वयन गलत है?
3) जब मैं autoplay="true"
पैरामीटर को हटाता हूं - कुछ भी नहीं दिखाता है, नियंत्रण और वीडियो चला जाता है और इसे खेलना असंभव है।
4) मैं autoplay="true"
को हटाना चाहता था, लेकिन poster="http://upload.wikimedia.org/wikipedia/commons/thumb/4/41/NYC_Times_Square_wide_angle.jpg/640px-NYC_Times_Square_wide_angle.jpg"
सहित पोस्टर जानकारी जोड़ना - कुछ भी नहीं बदला है, स्ट्रीम दिखाई नहीं दे रहा है, नियंत्रण वहां नहीं हैं।
5) जब मैं data-setup
पैरामीटर को निकालने और इस तरह इसे छोड़: <video id="video1" class="video-js vjs-default-skin" width="640" height="480" controls="controls" preload="auto" poster="http://upload.wikimedia.org/wikipedia/commons/thumb/4/41/NYC_Times_Square_wide_angle.jpg/640px-NYC_Times_Square_wide_angle.jpg" >
तो नियंत्रण और पोस्टर दिखाई (जो महान है), लेकिन प्ले बटन धूसर हो जाता है और यह मेरी धारा खेलने के लिए असंभव है।
मैं प्रभाव है कि वेब पेज लोड करने के बाद मैं प्ले बटन के साथ पोस्टर छवि देख सकते हैं, और जब मैं इसे क्लिक हासिल करना चाहते हैं - मैं ठीक से आकार दिया धारा देखेंगे। मैं क्या खो रहा हूँ? धन्यवाद!