I am using this,
$("#loginanchor1").click(function (e) {
e.preventDefault();
$("#signin_menu1").slideDown("slow");
});
$(document).mouseup(function (e) {
if ($(e.target).parent("a.loginanchor1").length == 0) {
//$(".signin").removeClass("menu-open");
$("#signin_menu1").slideUp("slow");
}
});
Everything works fine but what happens is when the signin_menu1
is displayed block and i click my mouse button inside the div the div slidesup... I want mouseup function to be prevented when the signin_menu1
is displayed block. So i thought of changing the condition like,
if(($(e.target).parent("a.loginanchor1").length==0) &&( //check the display of the div)
Now how to check the display?
Answer: Use the jQuery :visible Selector You can use the jQuery :visible selector to check whether an element is visible in the layout or not. This selector will also select the elements with visibility: hidden; or opacity: 0; , because they preserve space in the layout even they are not visible to the eye.
Use the getBoundingClientRect() method to get the size of the element and its relative position to the viewport. Compare the position of the element with the viewport height and width to check if the element is visible in the viewport or not.
Another way to check if an element is hidden is to use the window. getComputedStyle() method. It will return the display property value of the object. We can check if the string is equal to none meaning the element is hidden and do something.
try
$(document).mouseup(function (e) {
var $parent = $(e.target).parent("a.loginanchor1");
if ($parent.length == 0 && !$("#signin_menu1").is(':visible')) {
//$(".signin").removeClass("menu-open");
$("#signin_menu1").slideUp("slow");
}
});
I'm confused with the problem, but $("#signin_menu1").is(':visible')
would check if the div is visible (display:block).
added notes:
you may try to check if the $(e.target)
is the signin_menu1
or the is inside signin_menu1
. do it like this,
$(document).mouseup(function (e) {
if ($(e.target).is('#signin_menu1') || $(e.target).closest('#signin_menu1').length > 0) { return ; } // do nothing on mouseup
var $parent = $(e.target).parent("a.loginanchor1");
if ($parent.length == 0) {
//$(".signin").removeClass("menu-open");
$("#signin_menu1").slideUp("slow");
}
});
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