I am opening a popup window containing a flash movie using JavaScript. The popup contains a media player that uses SoundManager2. Users add files to the media player from the parent window. However, when reloading the parent window, the reference to the child window (media player) is lost. So, to bring focus to the media player, we currently have to call window.open, which reloads the url, thus interrupting the playing media.
Does anyone know of a way to focus the media player window without reloading its contents? I'm pretty sure Javascript is out. Is there a way to do this with ActionScript?
You could call a javascript function from Flash that gives that window focus, however, I'm not sure if there is a decent way of doing this that wouldn't potentially annoy a user, unless you can do it only when new media is added to the player.
In any case, ExternalInterface or getURL/navigateToURL will allow you to call a javascript function from Flash.
Related
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'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.
First I would like to say that I've been programming JavaScript for about 3 months now and also that I'm not very concerned with solving this problem by the standards or best practices. My main concern is learning to use the DOM. I don't want to use any jQuery because I'm not familiar with it.
I'm trying to make a non-profesional "login" function on my page, using JavaScript and the DOM. To begin with I was using "login" screen that would be displayed "hidden" initially and then be displayed "block" when in use. This worked fine and looked really good when I added a darkened screen behind the "login" screen by adding less opacity (0.1 opacity) to the main part of the page that's beneath the "login screen".
This (the opacity) would return to normal when I closed the "login" screen. So you can see all the stuff is happening within the same page using the same DOM. OK, this is how I wanted it to work: you create a username then you your create a password. Boom, finished!
But here's the problem: after you create a username and password I want it to say "Hello (username here)" where the login link initially was. I could just use the DOM and insert the username into the HTML page, but when I submit the form that is the login function the page gets reloaded and the changes to the DOM become erased!
So now I can tell you about the solution I thought of: make the form (login page) be in a new window, so when the form is submitted (and the DOM is manipulated) the new window is reloaded and then subsequently closes leaving the changes to the main pages DOM intact. Only problem is I can't figure out how to do this. You could probably say that's a major problem hahaha.
So, can I manipulate the parent windows (i.e. the calling window) DOM from the new window?
In response to your answer: you can modify the caller window's DOM by using window.opener.document from the new window;
window.opener is a reference to the caller window (if any, otherwise null), but only if both windows are from the same domain).
NOTE: Is it a small webpage or you are going to do a lot of DOM manipulation on a web site/application via javascript? In the later case you should use a javascript library/framework (I recommend jQuery) in order to do the dirty job more easily.
A popup window can find the window that opened it using the opener variable.
If both the popup window and the original window originate from the same domain, then the popup window can indeed modify the HTML of the original window.
If the popup window and the original window contain content from a different domain, then they can't see the HTML of each other - due to the cross-origin protection that browsers put in place.
I have a page that has a table whose rows are links to other pages.
When there is a click on a row (link), I set location to that URL like this:
window.location=mytable.rows[temp_no].getElementsByTagName("a")[0];
And in one of those link, a video player starts to play a file in the link and I want it to keep playing when I go back to the previous page so that I can listen to the music when browsing other links.
I go to the previous page with:
window.location.href="..";
This destroys everything i.e. video player naturally. I can't popup a new window or open video player in a new window since this application works on devices which have single browser window.
Any solutions ?
Of course it does. Changing the location causes the full page to be unloaded and the new one to be loaded.
If you do not want this behaviour you'll have to use AJAX to reload only parts of your site.
Opening the video in a popup window would be another solutionbut new windows are usually annoying, so provide the user e.g. with a "open video in new window" link.
Edit: In this case - assuming the TV browsers have sane JavaScript engines - use AJAX.
Another "solution" would be adding an onbeforeunload event to request confirmation from the user before he navigates away from the page.
Without being able to use a new window or AJAX it is impossible unless you use frames and just load another page in a different frame.
Use window.open on your videos in a different window so the parent window can navigate wherever.
Keep in mind that you'll have to disable any pop-up blocker.
** UPDATE **
If you need everything in the same window, consider using some iframe to view other pages. The advantage of iframes is that they have their own CSS styles, Javascript sandbox so any page viewed within an iframe does not (generally) affect it's parent container. Of course, there are ways to communicate between an iframe and it's parent and vice versa. But this is out of the question scope.
I want to make my page viewed at full screen.
How can I programatically press F11 on page load. Is it possible?
Thank you
No - not possible without JavaScript. And only then, you can open a large new window, but not emulate pressing F11.
Also, changing browser window sizes without the user's consent is very frustrating for them.
It is not possible to open a window full screen on load. It is not possible to resize the page you are loading.
What you can do is to open a max size child window, say on click of a button etc (if you do it onload, popup blockers would block it).
If it is a corporate intranet then perhaps you can add a rule to all your browsers to add your site to the popup blicker whitelist.
You can also use flash (etc) to open a document full screen, but this is not probably what you are looking at.