- डेवलपर अब डाउनलोड, फ़ुलस्क्रीन, और रिमोटप्लेबैक बटन जैसे मीडिया कंट्रोल को अपनी पसंद के मुताबिक बना सकते हैं.
- "होमस्क्रीन पर जोड़ें" फ़्लो का इस्तेमाल करके इंस्टॉल की गई साइटें, मेनिफ़ेस्ट के स्कोप में ऑडियो और वीडियो अपने-आप चल सकती हैं.
- Android डिवाइस पर Chrome, अब म्यूट किए गए वीडियो के न दिखने पर, अपने-आप उसे चलने से रोक देता है.
- डेवलपर अब
color-gamutमीडिया क्वेरी का इस्तेमाल करके, उन रंगों की अनुमानित रेंज ऐक्सेस कर सकते हैं जो Chrome और आउटपुट डिवाइस के साथ काम करते हैं. - मीडिया सोर्स एक्सटेंशन का इस्तेमाल करते समय, अब एन्क्रिप्ट की गई और साफ़ की गई स्ट्रीम के बीच स्विच किया जा सकता है.
मीडिया कंट्रोल को पसंद के मुताबिक बनाना
डेवलपर अब नए [ControlsList API] का इस्तेमाल करके, Chrome के मूल मीडिया कंट्रोल को पसंद के मुताबिक बना सकते हैं. जैसे, डाउनलोड करना, फ़ुलस्क्रीन करना, और [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
शिप करने की इच्छा | Chromestatus Tracker | Chromium बग
प्रोग्रेसिव वेब ऐप्लिकेशन के लिए, होम स्क्रीन पर अपने-आप चलने की सुविधा जोड़ी गई
पहले, Chrome सभी autoplay को बिना किसी अपवाद के Android पर आवाज़ के साथ ब्लॉक करता था. अब यह सच नहीं है. अब से, होम स्क्रीन पर जोड़ें सुविधा का इस्तेमाल करके इंस्टॉल की गई साइटों को, बिना किसी पाबंदी के वेब ऐप्लिकेशन मेनिफ़ेस्ट में शामिल ऑरिजिन से, ऑडियो और वीडियो अपने-आप चलने की सुविधा मिलेगी.
{
"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>
शिप करने की इच्छा | Chromestatus Tracker | Chromium बग
म्यूट किया गया वीडियो न दिखने पर, अपने-आप वीडियो चलने की सुविधा को रोकें
जैसा कि आपको पहले से पता होगा कि Android पर Chrome, muted वीडियो को उपयोगकर्ता के इंटरैक्शन के बिना ही चलने देता है. अगर किसी वीडियो को muted के तौर पर मार्क किया गया है और उसमें
autoplay एट्रिब्यूट है, तो Chrome वीडियो को उपयोगकर्ता को दिखने के बाद चलाना शुरू कर देता है.
Chrome 58 से, पावर के इस्तेमाल को कम करने के लिए,
autoplay एट्रिब्यूट वाले वीडियो को ऑफ़स्क्रीन होने पर रोक दिया जाएगा. साथ ही, Safari iOS के इस्तेमाल की वजह से, व्यू में वापस आने पर उसे फिर से शुरू किया जाएगा.'
शिप करने की इच्छा | Chromestatus Tracker | Chromium बग
color-gamut मीडिया क्वेरी
चौड़ी कलर गैमट स्क्रीन लोकप्रिय होने के साथ-साथ, साइटें अब
color-gamut मीडिया क्वेरी का इस्तेमाल करके,
Chrome और आउटपुट डिवाइस के साथ काम करने वाले अनुमानित रंगों को ऐक्सेस कर सकती हैं.
अगर आपको कलर स्पेस, कलर प्रोफ़ाइल, गैमट, वाइड-गामट, और कलर डेप्थ की परिभाषा नहीं पता है, तो हमारा सुझाव है कि आप वेब पर कलर को बेहतर बनाना WebKit ब्लॉग पोस्ट पढ़ें. इस बारे में ज़्यादा जानकारी दी गई है कि जब उपयोगकर्ता वाइड-गामट डिसप्ले पर होता है, तो color-gamut मीडिया क्वेरी का इस्तेमाल करके वाइड-गैमट इमेज दिखाने के लिए क्या किया जाता है. अगर ऐसा नहीं है, तो एसआरजीबी इमेज पर फ़ॉलबैक कैसे किया जाता है.
फ़िलहाल, Chrome में लागू किए गए srgb, p3 (डीसीआई P3 कलर स्पेस से बताए गए गैमट), और rec2020 (ITU-R सुझाव BT.2020 कलर स्पेस में बताए गए गैमट) को स्वीकार किया जाता है. आधिकारिक सैंपल देखें.
एचटीएमएल में इस्तेमाल:
<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")';
}