CSS的替代品：悬停在iPad上

Question

我有很多代表用户的300x200px div（.contentUser）渲染。

contentUser:hover(over) 
    ->shows another div(.contetnButtonWrap) sliding in with buttons.
contentUser:hover(out)
    -> contentButtonWrap slides out again

除了iPad（没有悬停）之外，我在目前为止测试过的任何设备上使用CSS都能正常工作。我尝试过：主动但不起作用

所以在iPad上而不是hover(over)我使用onclick：

function alternativeHover() {
    var userDivs = document.getElementsByClassName('contentUser');
    [].forEach.call(userDivs, function(e){
        e.onclick = function() {
            var target = e.getElementsByClassName('contentButtonWrap');
            e.style.backgroundSize='450px 300px';
            e.style.outline='3px solid green';
            target[0].style.left=0;
        };
    });
};

我有3个问题：

• 在这种情况下，这真的是最好的吗？

• 如何处理hover(out)，它是一个div，所以它不会抓住焦点所以我不能使用onblur！而且我不想检查mousemove上的像素或类似的东西。

• 如果适用于Android智能手机和iPhone，为什么不在iPad上悬停工作？