javascript popup window remember last size and position - javascript

I am opening pop-up window through JavaScript with resize option for end user. End user may resize pop-up window or change its default position by dragging it.
I have requirement of remembering last position and size of pop-up window when user closes the window.
At present I can keep last size of the pop-up window in onbeforeunload event using cookie. But still could not find last position of the window.
Am I missing something very obvious, or what I am doing is the correct way to do it.

The function window.open() returns a handler to the opened window.
var myWindow = window.open('some_url','some_name');
You could maybe then use the myWindow to obtain its position.
Make a try with window.screenLeft/window.screenTop on IE and window.screenX/window.screenY in other browsers to get the positon.
Hope this helps,
d.

Finally I used cookie solution to remember position of last open window.

Related

How to make this JavaScript popup window modal?

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.

Controlling browser window (top window and not popup) height and width from that window itself

Controlling browser window (top window and not popup) height and width from that window itself. I am trying to achieve this but no success till now. How I can achieve this?
Till now I tried using
window.resizeTo(weidth , height)
but it works only with child windows and not on top window.
Also I have to control address bar, menu bar etc for top window. Basically all thinks which we can control though JavaScript while opening popup, I want to do it though same window and that window is top window (not a child window).
In Short I can’t use this below code for opening popup window.
var showMyPage = function(){
url = "myPage.html";
window.open(url, "myWindow",
"toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=yes,width=400,height=600")
}
And I want to achieve same result as of opening popup on clicking below link. So it is obvious that I have to control all options from myPage.html window only.
Open myPage
Found out one way to solve this by adding JavaScript code directly on link click and open new window.
<a href="myPage.html" target="_blank"
onclick="window.open(this.href,'myWindow',
'toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=yes,width=400,height=600');
but still if you have any other way to solve this then please let me know.

Can JavaScript detect onblur() for a window opened through window.open()?

What I'm looking to do is create a new window using window.open and then when the new window opens, I want to check if that window is active throughout?
For example: I have
myNewWindow = window.open(document.getElementById("inputbox").value).focus();
Once this window opens, I want to increment the value of variable increase if myNewWindow loses focus.
I'm doing :
if(myNewWindow.onblur()){
increment value...
}
setTimeout('myNewWindow.close()',3000); // closing window after 3 seconds. So, I'm really trying to check if the window was in focus for those 3 seconds.
However, the onblur does not seem to work no matter what I try. but, window does close.
Any ideas anyone? I just need to find out if the new opened window was minimized or some out of focus.
Its fairly easy to detect if the window in which you are running your JS is losing focus or not. And the same does not seem to work in my case. For example: JavaScript / jQuery: Test if window has focus
From page1, no you cannot directly set or subscribe to events on page2. However, you can use something like window.postMessage to pass messages between them.

Can I change a non-resizable existing browser window with Javascript to be resizable?

Simple question, I have a window that was opened with this code
window.open(URL, windowName, 'resizable=no');
I know I can control size and position programmatically after it's loaded
but how do I make it simply reziable again? is there any way to override it?
(NOTE: I have no access to modify the opening code, but have full access to the child window code)
A hack can be this:
window.open(window.location.href, document.title, 'resizable=yes');
window.close();
but it cause your window open a new window and close itself that is not a good UX
You can resize the child window like this:
self.resizeTo(width, height);
As for making the child window resizable again, I don't think you can. The parent window has control of the child.
No, whether a window is resizable is determined when it is opened. Changing this flag after the fact isn't possible. Depending on your goal opening a new (resizable) child window and closing the old one might be an option, I don't think there are any alternatives.
I can't find it in w3c site so this might be deprecated, but window.setResizable(true) should set it's own window resizeable.
Give it a try, check the link for more information on the restrictions.
The method is also listed here.
Of course that, having control over the child, you could also create a new child from it I guess, as a last resort.
var win = window.open(URL, windowName, 'resizable=no');
win.resizeTo(*yourWidth*, *yourHeight*);
you can use resizeTo to your width and height to change the window size

Triggering a target=_blank link from JavaScript

This is a nasty one.
I have an external link.
<a href="http://www.example.com" target="_blank">
now I want to track a Google AdWords conversion every time that link gets clicked.
To do that, I add a click event that loads a Google image. The image counts the conversion. To make absolutely sure the image gets loaded before the user leaves, I use the image's load event to proceed to the original link's target.
$("#linkname").click(function() {
var element = document.createElement("img");
element.onload = function() { ..... };
element.setAttribute("src", "http://www.googleadservices.com/....");
document.body.appendChild(element);
});
This will work fine using location.href. However, it won't work for target="blank" links.
I'm baffled as to what to put into the onload function in order to open a new window.
I can't use window.open because it will be caught by pop-up blockers (Because it's located in the image's onload event, it looks like a purely programmatical call that has nothing to do with the link being clicked.) Also, calling window.open without any options does not give me any controls in Google Chrome.
I can't make the click event continue its normal course because I have to wait until the image is loaded, which is an asynchronous operation!
What I would need, essentially, is a way to open a target="_blank" link programmatically, something that may not be possible because it could be circumvented by pop-up-blocker-breakers.
Alternatively, I would need a way to reliably count hits while letting the link's original click event continue as it's supposed to.
Does anybody have an idea what to do?
Since the link opens in new window, you don't really have to wait for the image to load. Let the image load in the current window (as is being done) and let the user see the new window as normal. It would be very unlikely that the user can close the window before the image is loaded, thus the count would not be disturbed.
I am not sure if it will work or if you can (because of some requirement) do this but:
Try to open a new window with no location, but on the real click event (not in the onload of the image), but open this window with width and height 0, and puts its x and y in somewhere not visible by the user, or less visible as possible.
Keep a reference to this window.
On the onload event of your image, change the location of the new window's url, and then resize and reposition the new window.
Hope it works.

Categories

Resources