jquery - 想要在用户单击时更改 iPad 中的按钮图像

Question

我们知道 iPad 中不允许悬停效果，但我想在用户单击按钮时更改按钮图像。除了 iPad 和 iPhone 设备，下面的 css 工作正常。

.back-btn {
background: url("images/sprite.png") no-repeat scroll 0 0 transparent;
}
.back-btn:hover, .back-btn:active {
background: url("images/sprite.png") no-repeat scroll 0 -10px transparent;
}

谢谢 AV

Answer 1

问题是你需要寻找touchstart事件让 iPad 识别它，否则你可以设置悬停事件。用一点浏览器嗅探-繁荣你应该很高兴。（jQuery 方面）

var ua = navigator.userAgent,
    event = (ua.match(/iPad/i)) ? "touchstart" : "hover";

$(".back-btn").bind(event, function(e) {
    $(this).css('background', 'url("images/sprite.png") no-repeat scroll 0 -10px transparent;');
});

有关html5 触摸事件的更多信息，请点击此处。

Answer 2

:active类仅适用于锚点，不适用于按钮。您可以使锚看起来像一个按钮，然后您可以使用此类进行操作。

看看这个例子