CSS :active pseudo class no longer triggers in 10.1+

by Retired on ‎06-14-2013 02:05 PM (2,276 Views)

Since BlackBerry 10 OS version 10.1, DOM elements no longer trigger their CSS :active pseudo class when touched, unless a 'touchend' event is attached. These no longer trigger when using 'click' events. This was done for performance reasons.

 

For example, If you are using CSS :acive pseudo class to highlight menu items for example, they will need to change the listeners from:

 

//from
someDiv.addEventListener(‘click’,function,false);
//to
someDiv.addEventListener(‘touchend’,function,false);

To keep the code cross-platform (touchend only works on touchscreen devices, not desktop), you can create a little helper function as such:

 

var clickOrTouch = 'ontouchstart' in window ? ‘touchend’ : ‘click’;

 And then use clickOrTouch instead:

 

someDiv.addEventListener(clickOrTouch,function,false);

This will query the browser to see if touch is supported and use touched instead of click.