I'm having an issue with a our main application's window activating itself when the mouse is hovered over it.
I'm opening the new window in a javascript function using the line below:
window.open(URL, 'Requests', 'location=no,toolbar=no,status=yes,scrollbars=yes,resizable=yes');
I have noticed that if I open a new IE window through Explorer, hovering over our main application's window does not reactivate itself. Even in this case though, the main window does make itself be "on top" of the pop-up window created by the window.open command above.
The question is this: Is there any way, when opening a "child" window in javascript, to detach the child window from the parent?
Further info: I am using an Infragistics WebDataMenu with ActivateOnHover set to true so users don't need to click on main menu items to see sub-menu choices. Unfortunately, that setting sensitizes the whole menu bar so that sliding the mouse through it activates the menu (and sadly the window when a popup is active). This is the root behavior I'm trying to fix.
The window.open(); method will create a popup window that really only shares a relationship through JavaScript via the return value of the call, and the window.opener property on the popup window.
What you want is the behavior of a modal window that locks out interaction from the 'parent' page while you work on the 'child' popup.
You can try to fight with JavaScript (and your users) by forcing a focus on the popup and blocking any blurring but this will drive users nuts when they want to go read their email etc. (eg not recommended)
You can also use the not so standard showModalDialog(); method but support is far from fully cross browser and there are a whole bunch of new problems if you try to use this (no right click in IE, zoom issues in IE, and no grandchildren popups to name a few) (again not recommended)
What you can do is make an "overlay" popup similar to many online photo viewers where you first overlay a mask (typically semi transparent) that blocks mouse/focus on the entire page content below and then overlay that with your "popup content". Just be sure that you provide a close option that removes the mask when the overlay is closed/done.
Note if you need to support IE6 you'll also need an iframe shim (Google if needed)
Many UI frameworks will provide a "dialog" just like this for you. (Eg jQueryUI)
Ultimately, I gave up on making this work. I found that what I had to do was turn off ActivateOnHover from the WebDataMenu, which didn't answer this question and requires users to click on the menu to make it drop down, but it became a work-around.
Related
This is working well for me, but I need to make it modal so it doesn't get lost behind the main app screen. Is there a way to easily make this screen modal?
string url = "EditTables.aspx?title=Edit Asset Classifications&prompt=Classification Name&method=GetClassifications&name=ClassificationName&value=ClassificationID";
string script = "window.open ('" + url + "', 'popup_window', 'width=500,height=135,left=200,top=150,scrollbars=0,resizable=no');";
You can't make the popup modal on modern browsers. (There used to be a different method you could use for popup modals, but it's deprecated now.)
By default, that window should appear in front of the window that opens it. You can also respond to clicks on the opening window's document by calling focus on the window returned by open, to bring that other window to the foreground (stopping when you see the unload event from the popup).
If what you're showing in the modal doesn't have to be a separate window, you might consider not using a separate window at all, but instead using an absolutely-positioned div or similar with an element behind it that covers the entire remainder of the window so that it can prevent clicks and similar from reaching the elements underneath it. But if it has to be a separate window, you don't have much you can do other than the focus thing.
I'm trying to make a popup window fullscreen, completely fullscreen, no borders.
I've found scripts (a great one by David Walsh) that set the current page or any element on the page to fullscreen, but I can't get them to work on a popup window.
The limitation is that you can't go fullscreen without the users approval, so he or she must click, but it seems that that "approval" does not carry over to a new window.
Is there a way to carry over this approval or get the new window fullscreen?
I'm leaning towards no and I'm thinking of implementing a way with a hidden div on the page that loads content on focus via ajax or iframe (just brainstorming not tested yet).
I am trying to open a bare bones window using window.open(), which is pretty basic and easy to do. I'm concerned here with Chrome running on Mac OSX.
My code:
window.open(url, "_account", "scrollbars, resizable");
A user asked me to add navigation controls (forward, back, reload), menu bar, status bar, and the ability to add new tabs from the child window... basically he wanted the window to behave like a "normal" browser window.
My code changed to:
window.open(url, "_account", "toolbar, scrollbars, resizable, menubar, location, status");
This was just me basically adding all of the options I could find to enable everything available. Yet this does not actually bring up the navigation controls or an address bar, or the 'new tab' button. When I checked mozilla's window.open() page, (especially the section describing the 'toolbar' option), I read this:
If this feature [toolbar] is on, then the new secondary window renders the Navigation Toolbar (Back, Forward, Reload, Stop buttons).
That sounds like it should have done exactly what I want, but I don't see those controls.
So, are child windows prevented by some unchangeable browser policy from having those controls? I don't see on that reference page how to add new tabs, address bar (that I can edit to go to a new location).
Thanks in advance.
(edited to address James's comment below)
I'm working with a software package that creates Flash panorama .swf's. The package allows the creation of hotspots in the pano. You can specify the URL and the Target of the hotspot, so if you click on the hotspot it launches the URL in _blank, _self, etc.
However, the package doesn't allow you to specify the attributes of the window.
I'm trying to figure out if there's a way for the child window (once the swf opens it), to control it's own window attributes via Javascript.
I want to be able to control the size of the window and hide the address bar, status bar, etc.
One other issue that I need to deal with is this...I don't want the child window to open in a tab, but in a new smaller window...the only way that I've done this in the past is if the parent opens the child window and specify the size and that there are no menu bars and address bars. I'm not sure how to do that from the child window.
want to be able to control the size of the window and hide the address bar, status bar, etc.
You can maybe use window.resizeTo / window.resizeBy to resize the window. I'm saying "maybe" because some browsers will allow this only for windows opened through window.open().
You will not be able to get rid of the address bar and status bar in modern browsers any more for security reasons.
One other issue that I need to deal with is this...I don't want the child window to open in a tab, but in a new smaller window...the only way that I've done this in the past is if the parent opens the child window and specify the size and that there are no menu bars and address bars. I'm not sure how to do that from the child window.
This would amount to turning a "normal" window into a window.open popup window - I don't think that can be done at all.
Sadly, dealing with pop-up windows has become very restrictive because it has been abused so much.
when you visit http://www.daniweb.com you get a popup window, what is this called + any idea how to do it?
Thank you for your reply, what is the simplest way to do have a modal loading animation only i.e. when page loads that animations shows and when done the animation goes? ASP.NET/Ajax
You'd call this a modal dialog, and you can implement one very easy with jquery ui:
http://jqueryui.com/demos/dialog/#modal
I like to refer to these windows as ANNOYING
The other name is some form of JS or JQuery.
Its called a javascript popup window.
Here's a link to show you how to open a js window
The way it looks though is they are using the modal popup extender provided by the ASP.net AJAX Control library. This can be simulated via JQuery as well.
It's called a modal dialog window. "Modal" meaning "mode" as in the UI has two modes, one where you can only interact with the dialog window, the other where there is no dialog window and you can interact with the rest of the page.
Probably looks something like a lightbox/thickbox .Showing some text/html instead of images
This is a modal pop up window, meaning you can't do anything else while that window is open.
Here are a bunch of ways to make them.
You can set up this kind of popup by having Javascript on the onload event create an overlay div that has height 100% and a higher z-index than the content, and also a div for the popup with position fixed and an even higher z-index. Then when the user clicks on close or otherwise it is time for the popup to go away, the Javascript can set display: none on these divs.
You can use Firebug (or IE Developer toolbar) to see the styles used on the example page you mentioned and use that as a model.
(Also they are annoying, but at least better than pop-unders, IMO ;-) )
Thats a modal dialog popup. Here's a nice jQuery version that I have used before.