Использование события mousedown на мобильных устройствах без мобильного jQuery?

Я создал веб-приложение, и для небольшой полировки я хотел добавить обработчики mousedown и mouseup для замены изображений (в данном случае, чтобы кнопка выглядела так, как будто она нажата ).

Мой код выглядит примерно так:

window.onload = function() {
    //preload mouse down image here via Image()
    $("#button_img").mousedown(function(){$("#button_img").attr("src","button_on.png");});
    $("#button_img").mouseup(function(){$("#button_img").attr("src","button_off.png")});
}

На настольных компьютерах это работает без проблем, но на мобильных устройствах (тестирование в iOS Safari) события mousedown и mouseup происходят одновременно, поэтому фактически ничего не происходит.

Я пытался использовать события vmousedown и vmouseup в jQueryMobile, однако этот код:

//include jquerymobile.js and jquerymobile.css 
window.onload = function() {
    //preload mouse down image here via Image()
    $("#button_img").vmousedown(function(){$("#button_img").attr("src","button_on.png");});
    $("#button_img").vmouseup(function(){$("#button_img").attr("src","button_off.png")});
}

Только что выдал ошибку, что vmousedown и vmouseup не существуют. Кроме того, jQueryMobile переопределяет CSS, который я уже написал для страницы.

Так есть ли способ заставить vmousedown и vmouseup работать, и сделать это без jQuery Mobile CSS?