blackberry/WebWorks-Samples

Sample Code Swipe Down menu doesn't display on first use

Closed this issue · 2 comments

The code shown here (http://supportforums.blackberry.com/t5/Web-and-WebWorks-Development/Sample-Code-Swipe-down-menu-for-BlackBerry-WebWorks-SDK-for/ta-p/943521) does not work on OS 2.0 device (works on Simulators and Ripple). It is reported to not work on 1.0.x devices either.

The issue is: on first swipe down the menu opens but is not visible (the bottom border can be seen moving down). Once there has been some kind of interaction on the screen the menu appears. Subsequent opens and closes of the menu work until the app is closed and re-opened again at which point the issue appears again.

This issue is discussed in this post (http://supportforums.blackberry.com/t5/Web-and-WebWorks-Development/onSwipeDown-Menu/m-p/1396371/highlight/true#M17911) with a solution of removing the z-index from #menuBar. This does work but when using a framework such as BBUI.js it is problematic as it uses a high z-index to display its title bar. While the menu displays properly it is behind the title and it is unusable.

After a little testing it actually looks like the z-index and CSS3 transitions combined that are the problem. It may actually be a browser issue rendering this rather than an actual code issue. When the CSS3 transitions are removed and jQuery.slideDown and jQuery.slideUp are used it functions fine.

Pull request #21 submitted to address this issue. This includes a swipedown.js sample app.

Screenshot: http://twitter.com/#!/n_adam_stanley/statuses/175231257284837377