Question

我只是想知道是否可以在不使用媒体查询的情况下定位平板电脑。我问这个的原因是我已经使用了媒体查询，但我在桌面上有灰度图像，当它们悬停时它们会改变为原始颜色。当设备达到一定的尺寸时，我已经删除了灰度，因此在较小的平板电脑和手机上它可以正常使用，但对于ipad和某些平板电脑进行景观处理时它只是有点小。

有没有办法定位平板电脑关闭过滤器而不触及媒体查询？

提前致谢

相关网站为www.garethjweaver.com

Answer 1

看一下Mobile ESP框架;特别是JavaScript。它可以检测单个设备或平板电脑等设备组。

http://blog.mobileesp.com/

与您想要实现的目标最相关的方法是：

MobileEsp.DetectTierTablet();

它还允许您通过操作系统选择特定的平板电脑组：

MobileEsp.DetectAndroidTablet();
MobileEsp.DetectWebOSTablet();
MobileEsp.DetectIpad();
MobileEsp.DetectMaemoTablet();
MobileEsp.DetectBlackBerryTablet();
MobileEsp.DetectOperaAndroidTablet();

可能的使用场景：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="http://www.hand-interactive.com/js/mdetect.js"></script>
<script>
    $(function() {

        if(MobileEsp.DetectTierTablet()) { // if its a tablet this will be true

            $("html").addClass("isTablet"); // this will add the isTablet class to the HTML element

        }    
    });
<script>

上面的示例使用jQuery，如果您开始使用JavaScript，这将使您更轻松。有了这个，您只需要在样式表中为平板电脑设置规则，如下所示：

<style>
    body {
        max-width: 1200px;
    }
    .isTablet body {
        max-width: 100%;
    }
</style>

它还有其他版本的ASP.NET和PHP，因此您可以执行检测服务器端。

这是一个说明上述功能的小提琴：

<强> Fiddle

Answer 2

我知道你不想触摸媒体查询，但据我所知，感觉你的问题可以解决 @media (orientation: landscape) { ... }

你想确定它是否是一个风景视图......是吗？

关于媒体查询的其他用法MDN:media query

如果你真的不想触摸它，还有另一种选择是使用javascript。但我认为这将使事情变得更加复杂。

希望我的回答有帮助.. :)

在不使用媒体查询的情况下定位平板电脑

2 个答案: