Menu
I'm trying to change the background color of an link when the user touches/taps on a mobile, although the following code works, sometimes the link remains black and doesn't change back to white when you release, is there a better way of coding it?
$('#test').bind('touchstart', function() {
$(this).css('background-color', 'black');
});
$('#test').bind('touchend', function() {
$(this).css('background-color', 'white');
});
Thanks!
507
To change the color of hyperlink text, click Hyperlink, and then click More Colors. To change the color of the followed hyperlink text, click Followed Hyperlink, and then click More Colors.
Hence, the background color of an active nav-item can be changed in the following manner by changing the background-color CSS property.
To change the background color of the button, use the CSS background-color property and give it a value of a color of your taste.
This can be done in CSS without jQuery:
a:active
{
background-color: black;
}
For some reason, the code above does not work in the Android's stock browser (and maybe some other browsers). However it will work once you add the ontouchstart="" argument to the <body> tag like so:
<body ontouchstart="">
Also, the Android stock browser highlights the links by default (with blue background, on my phone). To disable this, type:
a
{
-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
}
See this and this for more details.
92
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
