我编写了一个jQuery插件,可以在桌面和移动设备上使用.我想知道是否有一种方法可以检测设备是否具有触摸屏功能.我正在使用jquery-mobile.js来检测触摸屏事件,它可以在iOS,Android等上运行,但我也想根据用户的设备是否有触摸屏来编写条件语句.
那可能吗?
我有一些我以前建立的网站,使用jquery鼠标事件...我只是有一个ipad,我注意到所有鼠标悬停事件都是通过点击转换...所以例如我必须做两次点击而不是一次..(第一次悬停,比实际点击)
有解决方法吗?也许是一个jquery命令我shoudl已经使用而不是鼠标悬停/出去等..谢谢!
使用这样的HTML:
<p>Some Text</p>
Run Code Online (Sandbox Code Playgroud)
然后一些CSS像这样:
p {
color:black;
}
p:hover {
color:red;
}
Run Code Online (Sandbox Code Playgroud)
如何允许长时间触摸启用触摸的设备复制悬停?我可以改变标记/使用JS等,但想不到一个简单的方法来做到这一点.
:hover如果用户通过触摸设备访问我们的网站,我想忽略所有CSS声明.因为:hoverCSS没有意义,如果平板电脑在点击/点击时触发它,它甚至会令人不安,因为它可能会坚持直到元素失去焦点.说实话,我不知道为什么触摸设备:hover首先需要触发- 但这是现实,所以这个问题也是现实.
a:hover {
color:blue;
border-color:green;
// etc. > ignore all at once for touch devices
}
Run Code Online (Sandbox Code Playgroud)
那么,(如何):hover在声明触摸设备之后,我可以一次性删除/忽略所有CSS 声明(不必知道每一个)吗?
是否有任何漂亮和干净的方法或技巧,以确定用户是否在触摸设备上?
我知道有类似的东西
var isiPad = navigator.userAgent.match(/iPad/i) != null;
但我只是想知道是否有一个技巧来确定用户是否在Touch设备上?因为有更多的触摸设备和平板电脑,那么只有iPad.
谢谢.
当我在触摸设备上下来时,我不想要悬停行为.是否可以立即禁用整个网站的所有悬停效果?
鉴于您使用Modernizr来检测触摸并设置类.
这是我想出来的,但它给出了很多不一致性:
html.touch *:hover {
color: inherit !important;
background: inherit !important;
}
Run Code Online (Sandbox Code Playgroud)
有没有办法用纯CSS做到这一点?如果没有,如何用javascript完成?
这可能吗?如果没有将所有悬停样式转换为mouseover侦听器,是否可以阻止触摸设备触发CSS悬停状态?
我有一个必须同时处理触摸和指针输入的应用程序,它工作得很好但是在悬停上应用的某些样式在触摸设备上没有意义,因为它们倾向于在用户轻敲对象后无限期地保留悬停状态.
需要考虑的事项:
设备宽度与启用触摸的设备无关,我们在这里使用的触摸屏是桌面尺寸显示器.
我不想强迫用户通过触摸在多输入设备上输入.
我遇到与iPad/iPhone悬停问题非常类似的问题导致用户双击链接,用户点击链接必须点击两次以实际转到它.
我在那个问题中实现了解决方案,但我现在遇到了一个新问题.当用户点击链接时会发生重定向,但无论如何都会发生.因此,即使用户试图滚动页面,并且他们在链接上开始滚动,页面也会在他们放开滚动时重定向.
有没有办法保持链接,以便他们只需要一次点击,但如果他们滚动,不要重定向页面?