As the title says, i am working using wicket 6 and it would be very useful if the modal window was to close when i clicked outside of the bounds of the modal window, anyone have any idea on how i might go about this?
Try by adding this JS to your page:
$(function() {
$('.wicket-mask-dark').click(function() {
$('.w_close').click();
});
});
Related
I created modal in grapesjs to edit source code with editor modal. But when I am selecting text and release the button outside the modal, it will close without save.
Check documentation of grapesjs modal. There is link to configuration of modal behavior.
Just disable backdrop into editor init configuration.
const editor = grapesJS.init({
modal: {
backdrop: false
},
// rest of configuration
});
I'm developing an app using Angular and Semantic-UI. It should be accessible even for people who use keyboards for navigate the app.
I'm experiencing some problems with modal:
$(".my-modal").modal({
autofocus: true
});
$(function() {
$("#open").click(function(){
$(".my-modal").modal('show');
});
});
Here is the full code of my sample: http://jsfiddle.net/s6o0tdp7
As you can see when you open the modal the focus move on the first button. I would like to have focus on the entire modal, at the begin of the modal container, so users can move with tab button to go to the other sections of the modal that lay below.
Besides the modal should prevent users from going to elements of the page that is under the modal.
How to get these two behaviours?
CSS Modal window and iFrame
I am using the code in the above link to show modal pop up in salesforce. When i put Iframe in the modal pop-up the entire page greys out. Any idea what needs to be corrected?
Could you replace
<apex:page controller="tstpopup">
with
<apex:page controller="tstpopup" showHeader="false">
This should help when rendering in an iFrame.
I hope this helps. Cheers.
I'm using colorbox to display the help of my webapp. It's nice but what I want now is to open the popup with the help, and that the user can follow a tutorial video and doing at thte same time in the app.
So the possibility to click in the parent window without closing the colorbox window. I don't want to do action from the colorbox to the parent window, but directly click in the parent window, while watching my vid in the colorbox window.
I'm not sure colorbox is the tool to use with for this behaviour, but want to ask before to switch to another one.
Thanks
Bastien
You can set overlayClose and escKey to false.
Then you have to remove the overlay div by css. Like the following.
#cbobOverlay {
display: none;
}
So, to finish you probably have to add some button or link to trigger close when you want.
Close
jQuery('.close').click(function() {
jQuery.colorbox.close();
});
Hope this help.
Reference:
http://www.jacklmoore.com/colorbox
Is it possible to show a popup only in a certain gwt tab or a panel in that tab?
I've found methods to show a popups over the whole page, but not only in specific tabs.
When you switch the gwt tab, the popup should not be visible anymore and new popups should be able to be created, which again are only visible in the switched to gwt tab. Switching back to the other tab should then show the first popup again.
Optionally the rest of the tab, which is not covered by the popup, should not be clickable.
Are there any native methods for this? The gwt Popup Panel only seems to create popups for the whole page.
Edit: I've tried using smartgwts Window which seems to work just the way I want it to. When I switch the gwt-tab, the popup is no longer visible and returns when I switch back. The only problem is, that it isn't displayed right. The frame is placed on the far left side of the browser tab, while the content is displayed on the far left of the gwt-tab. If I move the content, the frame moves too. The frame is visible over the whole browser tab, while the content disappears if I drag it over the gwt-tab edge.
I guess it's because I'm adding a Window to a gwt-Panel. Is there any way to fix this without changing everything to smartgwt?
Not exactly, I think.
But, you can do something in the tab events, like hide the popup in tabs that it doesnt belongs. To avoid the lag of show/hide the popup, you can do this in the BeforeSelectionHandler, like this:
getView().getTabPanel().addBeforeSelectionHandler(new BeforeSelectionHandler<Integer>()
{
#Override
public void onBeforeSelection(BeforeSelectionEvent<Integer> event)
{
showPopupupsForTab(event.getItem());
}
});
In showPopupupsForTab you can show the popups for this tab (you can handle this with a map or something) and hide the others...
Something like this.
Hope it helps.