Colorbox popup: click on parent window without closing the colobox window - popup

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

Related

How to create a hint window to show gif and close the window after several seconds?

I want to write an extension of vscode. I need to show a gif somewhere. I see the hint on a variable of vscode is a window, is there an API to create such a window? Or is there other ways to create a window and close it after several seconds?
I don't think it's possible to show it in a window, but you could show it in an editor tab - more specifically, a webview. The default webview sample on that page even uses gif files. Since a webview simply renders HTML, you can use a regular <img> tag for this.
To close it again after 4 seconds, you can use setTimeout() with a callback that invokes WeviewPanel.dispose().

How to override panel close event

I have a jquery mobile panel menu (open) that has links (data-ajax=false) and want to override the default behavior of the panel closing before it navigates away. All of my pages have the panel menu open by default, and it looks bad when they automatically close every time I navigate only to appear open again on the destination page... is there a way to stop the close event?
I just ran into the same issue, and found something that seems to work - instead of using data-ajax="false", just put target="_self". jQuery Mobile doesn't load pages with AJAX if a target is specified, and "_self" is just the default. It also doesn't close panels like data-ajax="false" does.

Show popup/window in a gwt tab

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.

Open "Modal" Widow and close in TabGroup Based Application

Should Also have specified, I am developing this using Titanium Mobile.
I have a tabbed application. I have the need to open a "modal" like window for the purpose of allowing the user to enter some settings.
For example, you click the 3rd tab in the tabGroup. Some logic runs to see if a setting is set before continuing to create the view. The setting is not in place, so a new window animates in asking you to create this setting. After you create the setting, it closes and the view continues to render, or refreshes.
I cannot for the life of me figure this out. I have created the window, animated it into the current tab, and I have even successfully closed it. Getting the view to refresh or re-load is what is difficult. Also, the navigation bar offers the user the ability to navigate back to the window to change the setting, which I also do not want.
Any way to accomplish this?
I have the same need for logging the user into the application.
Use this code:
windowbject.open({modal:true});
This will only works in iOS.
And you want to refresh view which is behind this modal window then you have to add "focus" eventlistener to the window and write code in it.This code will execute when ever window got focus.
So when you close "modal" view then window behind it will get focus.
I hope this will help you.

GWT-Google web Toolkit-DialogBox

I have doubt regarding GWT .In Gwt if i click one button than it shows one dialog box at th same time the form outside the dialog box disabled.What component can be used for this task?
Thanks in advance
So, you want to open a popup dialog box, and at the same time disable the rest of the page until the user closes the dialog box?
If so, you can simply use gwt's DialogBox.
Use the constructor with the autohide flag set to false, and the box will not close until the user responds, thus disabling the rest of the page. If you want to make this even more clear, use the glass effect:
yourBox.setGlassEnabled(true);
You can also use the PopupPanel directly and build your own custom dialog box.
Now, if I got it wrong and you want to disable the form so it remains disabled after the popup, just disable it in the onClick handler of the button that opens the box.