- डेवलपर अब मीडिया कंट्रोल को अपनी पसंद के मुताबिक बना सकते हैं. जैसे, डाउनलोड, फ़ुलस्क्रीन, और रिमोटप्लेबैक बटन.
- "होम स्क्रीन में जोड़ें" फ़्लो का इस्तेमाल करके इंस्टॉल की गई साइटें, मेनिफ़ेस्ट के स्कोप में ऑडियो और वीडियो अपने-आप चला सकती हैं.
- Android पर Chrome अब म्यूट किए गए वीडियो के अपने-आप चलने की सुविधा को तब रोकता है, जब वह दिखता नहीं है.
- डेवलपर अब
color-gamutमीडिया क्वेरी का इस्तेमाल करके, Chrome और आउटपुट डिवाइसों के साथ काम करने वाले रंगों की अनुमानित रेंज को ऐक्सेस कर सकते हैं. - Media Source Extensions का इस्तेमाल करते समय, अब एन्क्रिप्ट की गई और साफ़ स्ट्रीम के बीच स्विच किया जा सकता है.
मीडिया कंट्रोलर को पसंद के मुताबिक बनाना
डेवलपर अब Chrome के नेटिव मीडिया कंट्रोल को अपनी पसंद के मुताबिक बना सकते हैं. जैसे, [ControlsList API] का इस्तेमाल करके डाउनलोड, फ़ुलस्क्रीन, और [remoteplayback] बटन.
इस एपीआई की मदद से, ऐसे नेटिव मीडिया कंट्रोल दिखाए या छिपाए जा सकते हैं जो काम के नहीं हैं या उपयोगकर्ता अनुभव का हिस्सा नहीं हैं. इसके अलावा, इस एपीआई की मदद से सिर्फ़ कुछ सुविधाओं को अनुमति दी जा सकती है.
फ़िलहाल, नेटिव कंट्रोल पर ब्लॉकलिस्ट करने की सुविधा लागू की गई है. साथ ही, controlsList एट्रिब्यूट का इस्तेमाल करके, एचटीएमएल कॉन्टेंट से सीधे तौर पर कंट्रोल सेट करने की सुविधा भी दी गई है. आधिकारिक सैंपल देखें.
एचटीएमएल में इस्तेमाल करने का तरीका:
<video controls controlsList="nofullscreen nodownload noremoteplayback"></video>
JavaScript में इसका इस्तेमाल:
var video = document.querySelector('video');
video.controls; // true
video.controlsList; // ["nofullscreen", "nodownload", "noremoteplayback"]
video.controlsList.remove('noremoteplayback');
video.controlsList; // ["nofullscreen", "nodownload"]
video.getAttribute('controlsList'); // "nofullscreen nodownload"
video.controlsList.supports('foo'); // false
video.controlsList.supports('noremoteplayback'); // true
Intent to Ship | Chromestatus Tracker | Chromium Bug
होम स्क्रीन पर जोड़े गए प्रोग्रेसिव वेब ऐप्लिकेशन के लिए, अपने-आप चलने की सुविधा जोड़ी गई
पहले, Chrome बिना किसी अपवाद के, Android पर आवाज़ वाले सभी autoplay ब्लॉक कर देता था. अब ऐसा नहीं होता है. अब से, 'होम स्क्रीन पर जोड़ें' सुविधा के बेहतर वर्शन का इस्तेमाल करके इंस्टॉल की गई साइटों पर, वेब ऐप्लिकेशन मेनिफ़ेस्ट के स्कोप में शामिल ऑरिजिन से दिखाए गए ऑडियो और वीडियो अपने-आप चलने की अनुमति है. इन पर कोई पाबंदी नहीं होगी.
{
"name": "My Web App",
"description": "An awesome app",
"scope": "/foo",
...
}
<html>
<link rel="canonical" href="https://example.com/foo">
<audio autoplay src="https://cdn.com/file.mp4"></audio>
</html>
<html>
<link rel="canonical" href="https://example.com/bar">
<audio autoplay src="https://cdn.com/file.mp4"></audio>
</html>
Intent to Ship | Chromestatus Tracker | Chromium Bug
जब वीडियो नहीं दिखता है, तब अपने-आप चलने वाले म्यूट किए गए वीडियो को रोकें
आपको शायद पता होगा कि Android पर Chrome में, muted वीडियो अपने-आप चलने लगते हैं. इसके लिए, उपयोगकर्ता को कोई कार्रवाई करने की ज़रूरत नहीं होती. अगर किसी वीडियो को muted के तौर पर मार्क किया गया है और उसमें autoplay एट्रिब्यूट मौजूद है, तो Chrome उस वीडियो को तब चलाना शुरू कर देता है, जब वह उपयोगकर्ता को दिखने लगता है.
Chrome 58 से, बैटरी की खपत को कम करने के लिए, autoplay एट्रिब्यूट वाले वीडियो के चलने की सुविधा को तब रोक दिया जाएगा, जब वे स्क्रीन पर नहीं दिख रहे होंगे. इसके बाद, जब वे स्क्रीन पर दिखने लगेंगे, तब उन्हें फिर से चालू कर दिया जाएगा. ऐसा Safari iOS के व्यवहार के मुताबिक किया जाएगा.'
Intent to Ship | Chromestatus Tracker | Chromium Bug
color-gamut मीडिया क्वेरी
वाइड कलर गैमट वाली स्क्रीन ज़्यादा से ज़्यादा लोकप्रिय हो रही हैं. इसलिए, साइटें अब color-gamut मीडिया क्वेरी का इस्तेमाल करके, Chrome और आउटपुट डिवाइसों के साथ काम करने वाले रंगों की अनुमानित रेंज ऐक्सेस कर सकती हैं.
अगर आपको कलर स्पेस, कलर प्रोफ़ाइल, गैमट, वाइड-गैमट, और कलर डेप्थ की परिभाषाओं के बारे में नहीं पता है, तो हमारा सुझाव है कि आप WebKit की ब्लॉग पोस्ट Improving Color on the Web पढ़ें. इसमें इस बारे में ज़्यादा जानकारी दी गई है कि color-gamut मीडिया क्वेरी का इस्तेमाल करके, वाइड-गैमट इमेज कैसे दिखाई जाती हैं. ऐसा तब किया जाता है, जब उपयोगकर्ता वाइड-गैमट डिसप्ले पर होता है. इसके अलावा, एसआरजीबी इमेज पर फ़ॉलबैक करने के बारे में भी बताया गया है.
Chrome में मौजूदा तौर पर, srgb, p3 (DCI P3 Color Space के हिसाब से तय किया गया गैमट) और rec2020 (ITU-R Recommendation BT.2020 Color Space के हिसाब से तय किया गया गैमट) कीवर्ड इस्तेमाल किए जा सकते हैं. आधिकारिक सैंपल देखें.
एचटीएमएल में इस्तेमाल करने का तरीका:
<picture>
<source media="(color-gamut: p3)" srcset="photo-p3.jpg">
<source media="(color-gamut: rec2020)" srcset="photo-rec2020.jpg">
<img src="photo-srgb.jpg">
</picture>
सीएसएस में इस्तेमाल:
main {
background-image: url("photo-srgb.jpg");
}
@media (color-gamut: p3) {
main {
background-image: url("photo-p3.jpg");
}
}
@media (color-gamut: rec2020) {
main {
background-image: url("photo-rec2020.jpg");
}
}
JavaScript में इसका इस्तेमाल:
// It is expected that the majority of color displays will return true.
if (window.matchMedia("(color-gamut: srgb)").matches) {
document.querySelector('main').style.backgroundImage = 'url("photo-srgb.jpg")';
}
if (window.matchMedia("(color-gamut: p3)").matches) {
document.querySelector('main').style.backgroundImage = 'url("photo-p3.jpg")';
}
if (window.matchMedia("(color-gamut: rec2020)").matches) {
document.querySelector('main').style.backgroundImage = 'url("photo-rec2020.jpg")';
}