I disabled the default .expose() closeonclick function because i want to close it with button. The problem is i cant find the code how to properly close it.
$('#button').on('click',function(){
...?
});
Just call on button click:
$.mask.close();
JSFiddle
Related
I'm trying to add a search button to a client website but it doesn't do anything.
Is my javascript correct or am I doing something wrong?
See in this link: https://fiddle.jshell.net/mdcnzfLw/
Your code doesn't have an event handler for the click event. While CSS makes the icon look clickable, it has no action behind it.
You want to add to your init function:
document.getElementById('icon').addEventListener('click', handleClick);
and then add:
function handleClick() {
alert('You clicked on search');
}
Replace the alert with whatever the code is supposed to do.
document.getElementById('icon').addEventListener('click', handleClick());
You missed the function call in the EventListener.
When a form submitted the modal box appears. This box contains a text with a link. Click on this link should close this box and toggle dropdown (auth form). The problem is that I can't handle toggling the dropdown by clicking this link.
Here is the code of click-handler of this link
$(function() {
$('#open_auth_form').click(function(e) {
e.preventDefault();
$('#participate_modal').modal('hide');
$('#auth_link').dropdown('toggle');
});
});
Why doesn't it work? I tried also to move dropdown toggling inside the 'hide.bs.modal', tried .trigger('click'). Nothing helped. But simple running
$('#auth_link').dropdown('toggle');
from console works well.
Check out this stack overflow question on How to open Bootstrap dropdown programmatically. There are a number of solutions you can try such as:
Triggering the click.bs.dropdown event:
$('#dropdown').trigger('click.bs.dropdown');
Or manually adding/removing the classes:
$('.dropdown').addClass('open'); // Opens the dropdown
$('.dropdown').removeClass('open'); // Closes it
In my case it was enough to add
e.stopPropagation();
How can i remove the focus on close button in jquery dialog when tab key is pressed.For buttons i have used tab-index=-1 and it worked.
Attaching the
$('.ui-widget-content').blur();
$('.ui-widget-content :button').blur();
$('.ui-dialog-titlebar-close :link').blur();
$('.ui-dialog-titlebar-close :button').blur();
$('.ui-icon').blur();
$('.ui-icon-closethick').blur();
$('.ui-dialog').removeClass('ui-state-focus');
http://jsfiddle.net/bharatgillala/a0ft8dm3/1/
I have tried the above statements but did not work for me.
Add tabindex="-1" to close button and trigger blur event on it. You don't need most of the stuff you tried, it can be as simple as
$(function () {
$("#dialog").dialog();
$('.ui-dialog-titlebar-close').attr('tabindex', '-1').blur();
});
Demo: http://jsfiddle.net/a0ft8dm3/4/
I am using a jquery plugin called mmenu to load a side menu when a button has been clicked.
That works fine, but Im also trying to get a hamburger style image going at the same time. I start off with the three lines and then when the menu button pressed it changes into a cross, this seems to work.
my issue comes when trying to close the menu, I want it to return back to a cross. The mmenu allows you to click anywhere to close the menu but I cant get the jquery right to change it back.
I added a class when the button (.menuvate) is clicked, called "active" which displays the cross but no matter how I try I cant get it to check that the class is active when anywhere on the page is clicked after the menu has been opened.
This is my code so far
$('.menuvate').click(function(){
$("#my-menu").trigger("open.mm");
$("#mm-0").addClass("menu-opened");
$("#nav-toggle").addClass("active");
});
$(document).click(function() {
alert("me");
});
I just put an alert in to tell me when this is being fired which of course it does everytime the page is clicked.
How do I get it to check for the active class after the menu has been opened when the page is clicked again so I can remove the class and change it back?
Thank you.
You will want to listen on the custom events to know if the menu is closing or closed.
Basically, what you want is:
$("#my-menu")
.on( "closing.mm", function() {
alert( "The menu has started closing." );
})
.on( "closed.mm", function() {
alert( "The menu has been closed." );
});
Read more on the ones fired by mmenu at http://mmenu.frebsite.nl/documentation/custom-events.html
You can use the jQuery hasClass attribute.
$("#mm-0").hasClass("menu-opened");
I have a popup where i basically just dim the body giving it the lights out effect. I have a click handeler where if the body is clicked it will close the popup but my issue is the click handler stops all clicks even before the popup is opened. Does anyone know how i could do this so that clicking on a link before the popup is opened would go to the link but clicking one after the popup was opened would do my function and not click the link?
Heres what i use right now:
$(document).ready(function() {
$("body").click(function(){
var element=document.getElementById("game");
//yes i could use the jquery method for all of these but this works
element.width="650";
element.height="500";
element.style.position="relative";
$("body").fadeTo(3000,1.0);
}
return false;
})
});
You can actually add your "body" click handeler only after clicking your link/opening the popup. Then after clicking the "body" you may remove it again and restore the click handler for your link. "bind()" and "unbind()" will be handy.
K
Where's the jQuery? When you use jQuery, you use jQuery...
When you click on the body, you can check whether #game is visible or not and work with that:
$(document).ready(function() {
$('body').click(function(e){
if (!$('#game').is(':visible')) {
$('#game').width('650px');
$('#game').height('500px');
$('#game').css('position', 'relative');
$('body').fadeTo(3000, 1.0);
e.preventDefault();
return false;
}
});
});