.mouseup() & .mousedown() bugs when firing from scrollbar click

[agarzola]

On Safari, Chrome, Opera and (according to ​http://stackoverflow.com/questions/4145402/mouseup-bug-in-all-browsers-except-firefox) all browsers except Firefox, .mouseup() event doesn’t fire when clicking on a scrollbar or its buttons, regardless of whether the element that bears said scrollbar is created dynamically or not.

Testcase: ​http://agarzola.com/jquerytestcase/

[anonymous]

Here’s a jsFiddle: ​http://jsfiddle.net/agarzola/g59KM/

[jitter]

Thanks for taking the time to contribute to the jQuery project by writing a bug report and providing a test case!

After checking your test case I don't really understand what about this is a jQuery bug?

Check this ​test case which doesn't use jQuery and shows the same behavior (the browsers simply don't fire the event).

[anonymous]

Is there a way to get around this for now?

[jitter]

Not that I know of. If you happen to find one please report back and append that information for others that happen to find this ticket.

I'm also not sure why you would need to do this. I guess a page/element is mostly scrolled by other means (not mousedown/up on scrollbars) anyway. e.g. mousewheel, arrow key, pgup/pgdwn.

[nicktheandroid]

i'm creating a page that can be scrolled by dragging and throwing, like on an iPhone. This example is an early stage of it, but this bug is what's messing it up and i'm not knowledgeable enough to know of a workaround. ​http://jsfiddle.net/nicktheandroid/7raYa/ try holding your mouse down on the page and flick it, then try using the scrollbar, and you'll see that the screen will stick to the cursor now, even though you're not holding the mouse button down, it's still stuck to the cursor.

[jitter]

Replying to nicktheandroid:

i'm creating a page that can be scrolled by dragging and throwing, like on an iPhone. This example is an early stage of it, but this bug is what's messing it up and i'm not knowledgeable enough to know of a workaround. ​http://jsfiddle.net/nicktheandroid/7raYa/ try holding your mouse down on the page and flick it, then try using the scrollbar, and you'll see that the screen will stick to the cursor now, even though you're not holding the mouse button down, it's still stuck to the cursor.

This bug tracker isn't the right venue to continue this discussion. You might want to try the ​#jquery irc channel on freenode and/or use the ​jQuery Forum for help with on this one.

Just as a general advise you probably might need to look into using non-native scrollbars. e.g. something like ​jScrollPane where the "scrollbars" are simulated by a styled div and thus you can attach any event handling there that you want.

[anonymous]

Here's a work-around

$(window).mouseup(function(el){

try{

'key' in el.originalEvent.originalTarget; not in chrome

} catch( ex ) {

console.log('scrollbars');

}

});

Basically, the property "key" which may or may not exist will give a permission denied error if it's the scrollbar; otherwise it will return "false" which will not trigger the try/catch block.

[anonymous]

we have an application that needs to record the frames/times of a video while the mouse is down, this is basically the work around I used:

if (event.target == $('html').get(0))

then it was probably the scroll bar so ignore it

which worked in IE9, Chrome24, Firefox18 (not an issue in Opera)

[pike]

Here's a work-around

$(window).mouseup(function(el){

.. but window.mouseup doesnt fire. at all.