Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Jquery Find if Event is a scrollbar click

I have a scenario where I am hiding a Div block if I click any where out side that div block.

I am using Internet explorer and testing the application. My code works fine if there is no scroll bar. If there is a scroll bar on the div block then when I click on scroll bar it considers scroll bar not as part of div and it hide the div block. I am trying to keep div block open even if user clicks on scroll bar and do a scroll operation.

var $container = $(".toolbarBlock");

 $(document).mouseup(function (e) {
        if (!$container.is(e.target) // if the target of the click isn't the container...
            && $container.has(e.target).length === 0) // ... nor a descendant of the container
        {
            toolbarClose();
        }
    });

 function toolbarClose() {
    return $.when(slideOut($container));
 }
like image 957
Kurkula Avatar asked Sep 17 '14 20:09

Kurkula


2 Answers

I would like to post answer so that it would be helpful to others who came across same problem.

I used:

e.target != $('html').get(0) // nor the scrollbar

var $container = $(".toolbarBlock");

$(document).mouseup(function (e) {
    if (!$container.is(e.target) // if the target of the click isn't the container...
        && ($container.has(e.target).length === 0) // ... nor a descendant of the container
        && (e.target != $('html').get(0))) // nor the scrollbar
    {
        toolbarClose();
    }
});

function toolbarClose() {
    return $.when(slideOut($container));
}
like image 139
Kurkula Avatar answered Oct 16 '22 04:10

Kurkula


There is no click event for a scroll bar in jQuery. http://forum.jquery.com/topic/click-event-for-scrollbar

However there is a .scroll() http://api.jquery.com/scroll/

You could listen for scroll events and show the container.

So as soon as they click the bar the element would hide, but when they scroll you could show the element again.

Not ideal, but from my research that is the only option.

like image 35
David Avatar answered Oct 16 '22 05:10

David