jquery - Body Click to Hide Element -
i have website i'm making, , have hidden menu, far works correctly, want when visible have option click on body make hide.
so far have code, doesn't work, since i'm coding on codeine gives me error "attempting assign readonly property", plus, makes entire page disappear.
here code segment, using in website parallax.js , fullpage.js
//function hidemenu { //var $menu_visivel = $('.menu2').is(":visible"); //if ($menu_visivel) { //$('body').click(function() { //}); //} else { //}; //}
check out working example in codepen.
you can add click event document
hide element. @ same time, need add stoppropagation
event element well:
$(document).click(function(event) { //check out clicking on element .menu , .menubutton if(!$(event.target).closest('.menu, .menubutton').length && !$(event.target).is('.menu, .menubutton')) { // check if .menu shown if($('.menu').css("left") == "0px") { $(".menu").animate({ left: "-200px" },200); } } });
to show on .menubutton
, hide @ loading time:
$(".menu").animate({ left: "-200px" },200); $(".menubutton").click(function() { // can enhance hiding $(".menu").animate({ left: "0" },200); });
this example shows parallax
plugin messing code.
by way, have $(document).ready()
inside of outermost one. need take out. additionally, trick @ moment working when right-click once on page. left-click not work. per observation, , useful post here, might because of plugin because vertical scrollbar on <p>
tag not show when needed unless right-click on page.
Comments
Post a Comment