具有触控功能的设备应如何区分纯触控和具有鼠标功能的设备？(就像今天的一些笔记本电脑)
需要在应用程序中优先考虑所有鼠标功能,如果运行应用程序的设备仅具有触摸支持,则需要更改功能.
如果触摸设备也有鼠标指针,逻辑建议应用程序应该将该设备视为普通桌面,并且可能还添加触摸支持,但样式本身应该响应鼠标事件.
正常的触摸检测是这样实现的:
'ontouchend' in document;
检测计算机是否为台式机的一种方法可能是检查屏幕分辨率:
window.screen.width >= 1280 // desktop
但这并不是那么好,因为有些设备可能具有非常大的视口分辨率,而某些笔记本电脑可能具有低分辨率......
我想知道如何在JavaScript中检测IndexedDB是否可用并启用.
我正在按照这些方针进行测试:
if (window.indexedDB) {
if ((using_chrome && browserVersion >= 24)
|| (usingFirefox && browserVersion >= 16)
|| (usingIe && browserVersion >= 10)
|| (usingEdge && browserVersion >= 12)
|| (usingSafari && browserVersion >= 9)) {
accessible = true;
}
}
但我更倾向于使用特征检测而不是依赖于版本号.
假设用于测试IndexedDB的功能检测是有效的,有没有人知道在页面加载上测试这个的好方法？
我实际上有一个问题我试图解决3周后.我试图测试对vw单元的支持并在浏览器不支持单元时提供单独的样式表我阅读了modernizr教程并熟悉modernizr css检测但是测试vh单位(视口相对单位)是我在网上找不到的东西.
所以基本上:
场景1:浏览器支持vw单元然后提供样式表A.
场景2:浏览器不支持它然后提供样式表B.
我确实发现有一个名为Modernizr.cssvwunit的非核心检测,但老实说我不知道在这种情况下从哪里开始或如何使用.
如果你帮助我扩展我的知识会很棒.此外,如果它不是太费力,我可以研究一个例子的jsfiddle将是非常有帮助的.
此致
马库斯
编辑:为什么它只触发else语句？ http://jsfiddle.net/5saCL/10
<script>
if (Modernizr.cssvwunit) {
alert("This browser supports VW Units!");
} else {
alert("This browser does not support VW Units!");
}
</script>
javascript css3 modernizr viewport-units browser-feature-detection
在搜索浏览器中检查CSS支持的方法时,我遇到了两种不同的方法:CSS和JavaScript.我之前使用过JS来检查浏览器中的功能支持,但是没有使用CSS属性.据我所知,较新的浏览器增加了对CSS的支持@supports,但是那些不支持的浏览器呢？
CSS示例@supports:
@supports (display: flex) {
div { display: flex; }
}
因此,如果旧浏览器不支持CSS @supports,那么使用JS和CSS方法是否切实可行？关于我上面的例子,是否可以用它做几乎一个if/else语句,例如:
@supports (display: flex) {
div { display: flex; }
} else {
div { display: none; }
}
我理解它可能不是关键词else,但能够按照这些方式执行某些操作将是有益的.所以,总结和组织我的问题:
@supports在不支持此CSS语法的旧浏览器中检查CSS属性支持的最佳方法是什么？if/elseCSS 有某种语法@supports吗？如何为不支持当前规范的浏览器通过功能查询或媒体查询可靠地为CSS网格样式创建后备？
根据此类文章，浏览器会忽略无法解析的CSS。因此，我希望否定功能查询即使在不支持它的浏览器上也能正常工作。例如IE11不支持功能查询，因此我希望它忽略这一行并在查询中应用样式：@supports not (display: grid){}。但是，正如您在此测试中所看到的，IE11会忽略该查询中的所有样式。
我找到了针对IE10 +的媒体查询，但该查询排除了其他不支持网格的浏览器。当然，我可以先声明后备样式并用@supports (grid-area: area)查询覆盖它们，但是我更喜欢不需要覆盖的解决方案。
从 Chrome 80 开始，您可以使用 来创建模块类型的工作器new Worker("worker.js", { type: "module" })，然后使用import工作器脚本中的模块功能。然而，其他浏览器仍在为此提供支持，因此使用它需要功能检测和回退。
是否有一种方便简单的方法来为工作人员提供检测模块支持？
注意在某些平台（例如 Cordova）上创建工作线程实际上并不简单，并且涉及大量变通方法，因此在纯 JS 中工作的东西将是理想的。