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;');
});

More information on html5 touch events here.

Answer 2

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

查看This Example

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

2 个答案: