Серая форма кнопки при нажатии на касание

Question

У меня есть ввод типа «кнопка» с фоном, и мне было интересно, как я буду серым на фоне через javascript. CSS для этого выглядит следующим образом:

background:url(../img/cameraPic.png) no-repeat center; 

Когда кто-то трогает его, я хочу, чтобы ответить на затенения в то время как он проходит вниз. Скелет для такой функции будет выглядеть так, но я не уверен, как изменить цвет, когда у него есть фон.

$("#myButton").bind('touchstart', function(e){ 
    //...What to put here?  
}); 

Есть ли идеи? Должен ли я использовать свойство grayscale() css или просто создавать новое изображение и заменять фон новым изображением каждый раз при его нажатии?

Answer 1

Что-то вроде этого? Example

$("button").bind('touchstart', function(e){ 
    e.preventDefault(); 
    $(this).css({ 
    'background-color':'grey', 
    opacity:0.3 
    }); 

}); 

$("button").bind('touchend', function(e){ 

    $(this).css({ 
    'background-color':'transparent', 
    opacity:1 
    }); 

});