JavaScript - Focus On Pop Up Window Not Working
function MyPopUpWin(message) {
var iMyWidth; var iMyHeight; //half the screen width minus half the new window width (plus 5 pixel borders). iMyWidth = (window.screen.width/2) - (75 + 10); //half the screen height minus half the new window height (plus title and status bars). iMyHeight = (window.screen.height/2) - (100 + 50); //Open the window. var generator = window.open(); generator.focus(); document.onmousedown = focusPopup; document.onkeyup = focusPopup; document.onmousemove = focusPopup; generator.document.write('<html><head><title>Pop uP</title>'); generator.document.write('<p style="color:#C52B27;">'); generator.document.write(message); generator.document.write('</p>'); generator.document.write('</head><body>'); generator.document.write('<a href="javascript:self.close()"><img src="/img/save_orange.gif" border=0"> <\/a>'); generator.document.write('</body></html>'); generator.document.close(); } function focusPopup(){ if(generator && !generator.closed) { generator.focus(); } } Similar TutorialsHi All, I need to show/focus the parent window which is in back when click a link from child window in Chrome.This problem is in Chrome browser only. We have used the below code self.blur(); Window.opener.focus(); But this is not working in Google Chrome. Please suggest me some workaround to achieve this. Thanks in Advance Reply With Quote 12-19-2014, 09:26 PM #2 Old Pedant View Profile View Forum Posts Supreme Master coder! Join Date Feb 2009 Posts 28,311 Thanks 82 Thanked 4,754 Times in 4,716 Posts Window is not defined. window is. JavaScript (and the DOM) is case sensitive. You must pay attention to upper/lower case spelling, carefully. By the way, you shouldn't need the blur() call. If you focus on some window (any window) then any other focus should be lost. currently i have the script as below which open the link in new tab but also shifts the focus to it...how do i keep the focus on the parent window PHP Code: <script type="text/javascript"> function openlink(url) { window.open(url); return false; } </script> <div class="btn" onclick="openlink()">Open Link</div> Hi, Can someone direct me to what do i need to get something like this going: When a user clicks on a button to focus a windows program thats already running Thanks I have a web page which lists and displays all the characters for which a Named Entity code exists, with coding details etc.. Some of these characters are quite obscure and the reader will only be able to see them if they have a suitable Unicode font on their own PC/browser. If not, they will just see placeholder squares. For these obscure characters, I've set up a popup window. Click on a placeholder square and a small window appears which shows a .gif of what the character should look like, and a label saying what it's called. If the user closes the window after viewing, there's no problem. The difficulty comes in if somebody wants to click on a succession of placeholders and view a succession of character .gifs, and meanwhile the initial child window has slipped to the back of the stack and is behind the webpage instead of in front. In IE, Netscape and Safari, it's easy - I just use .focus to bring the child window to the fore. In Chrome, which doesn't recognise the .focus command, I close the child window and re-open it. [There's code further up the document which identifies the browser.] However, neither .focus nor closing and re-opening the window works with Opera, which turns the child window into a tab rather than a separate window, and then shoves that tab to the back. Anybody know how I can get Opera to either move the focus to the child-tab on command, or close it on command so it can be re-opened? This is the code that generates the child window: Code: function charDisplayer() { if (isIEorInnerGroup == "Yes") {codeWidth = windowWidth*.171, codeHeight = windowWidth*.239, codeInset = windowWidth*.041} else {adjust(200), codeWidth = adjust_by, adjust(280), codeHeight = adjust_by, adjust(48), codeInset = adjust_by} if (isChrome == "Yes") { if (window.generator) { window.generator.close(); window.generator= null; } } window.generator=window.open('', 'charwindow', 'height='+codeHeight+', width='+codeWidth+', left='+codeInset+', top='+codeInset*2+', scrollbars=yes'); window.generator.document.write('<html><head><title>Character sample</title>'); window.generator.document.write('<link rel="stylesheet" href="'+styleType+'">'); window.generator.document.write('</head><body>'); window.generator.document.write('<p style="text-align: center;"><div class=centred><table class=centred><tr><td style="text-align: center;"><div class=centred><img src="artwork/font_characters/'+charID+'.gif" border=3 alt="'+charName+'" align=bottom border=0 width='+charWidth+'></div>'+charName+'</td></tr></table></div>'); window.generator.document.write('<hr /><a href="javascript:self.close()">Close</a> the popup if you have finished viewing characters.</p>'); window.generator.document.write('</body></html>'); window.generator.document.close(); if (window.focus) {window.generator.focus()} } Ignore the line which begins if (isIEorInnerGroup == "Yes") - this is part of a setup which resizes all art, tables etc to maintain a constant size across all browsers and screen resolutions. "stylesheet" is passed as a variable because I have two different stylesheets on the go, to accommodate the fact that Netscape handles text-size differently from the other browsers. There's a function elsewhere which sets the value of stylesheet according to whether the browser is Netscape or not, and whether the platform is a Mac or not. "charID" is a variable which identifies the code name of the character (taken from the Named Entity code) and looks it up under that name in a list of .gifs. "charName" is a variable which passes a text-string saying what the character is called, e.g. "Not a subset of". There is an "isOpera" variable which can be used to start a specific action if the browser is Opera. I have an application I'm working on and here is what I'm trying to do: I want users to work from a main application. Certain things will need to be done but the users wont want to see the main screen go away while doing these certain things. So my idea is to just open a new window with the content they need, they'll make their changes, the new window will close but then I want the main page to reload. What I've done now is at the end of the script that will be run prior to the new window closing is added this (its a php app): Code: echo "<script>window.close();</script>"; echo "<script>window.opener.location.reload(true);</script>"; Sometimes this works in IE and Firefox but never in Chrome. I know I've seen this done before on other sites, but I cant think of what they are. Can anyone tell me a reliable way that works in all browsers? Hi I'm banging my head against this problem and I'd really appreciate some help. I think the problem is cause by my lack of understanding of how the browser (firefox 3.6.3) handles focus. A simplified version of my problem is: I've defined the function Code: function two_focus() { document.getElementById("two").blur(); alert("hello"); } then in the body I have the form with two text boxes Code: <input id="one" type="text"><input id="two" type="text" onfocus="two_focus();"> When the page is loaded and I click in the second textbox I get the alert, all well and good. I OK the alert box, but when I click on box 1, or anywhere on the page for that matter, the function is called and the alert comes up. I just don't understand why the focus is being returned to the second box when I click anywhere in the browser window. Any comments will be gratefully received. Hi, i have the following html page <html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> </head> <body> <input type="text" id="input1" /><br /> <iframe id="textEditor" name="textEditor"> </iframe> <script type="text/javascript"> $(document).ready( function() { textEditor.document.designMode = "on"; textEditor.document.open(); textEditor.document.write('<head><style type="text/css">body{ font-family:arial; font-size:13px;}</style><body>Hi User<br /><br /><span style="font-style:italic;">### Write your message here ###</span><br /><br />Thanks,<br /></body></head>'); document.getElementById("textEditor").contentWindow.addEventListener('focus', OnFocus, true); $("#input1").focus(); } ); function OnFocus() { textEditor.document.body.innerHTML = textEditor.document.body.innerHTML.replace('<span style="font-style:italic;">### Write your message here ###</span>', ""); document.getElementById("textEditor").contentWindow.focus() } </script> </body> </html> Now press on the tab key when the page loads (You should see focus on the textbox field) and you can see that the iframe text editor (WYSIWYG) has no focus... On firefox it works... How can i give it focus on chrome? Hello I have an onclick function used in my table which opens a new window on clicking the table element.. it works fine except that I seem unable to name the window being opened... Here is my function for opening the window: Code: function LinkTo(page){ window.open ("http://www.xxx.com , "testpage" ); } Any thoughts? Thanks Hello, I have a bit of javascript that automatically loads Shadowbox on load. It works perfectly in Firefox, Chrome but NOT IE. If I put a standard link to open Shadowbox does work in IE, so it's not the shadowbox, it's definitely the window.onload bit which isn't working. Here is my code. Code: <link rel="stylesheet" type="text/css" href="shadowbox/shadowbox.css"> <script type="text/javascript" src="shadowbox/shadowbox.js"></script> <!--this bit is for a link to open the Shadowbox from a link elsewhere on the page --> <script type="text/javascript"> Shadowbox.init({players:['swf']}); </script> <script type="text/javascript"> window.onload = function() { Shadowbox.open({ content: 'flash/flash002.swf', player: "swf", title: 'Open Shadowbox', width: 1200, height: 800, }); }; </script> This DOES work though, so I know it's not the Shadowbox with the issue Code: <a href="flash/flash002.swf" rel="shadowbox;height=800px;width=1200px">Open Shadowbox</a> Really appreciate your help! Nicola Can anyone tell y the below code is not working in ie7 and ie8. working fine in ie6 window opened and gets closed immediately Very Urgent: <script language="javascript"> var perlwin; perlwin=window.open("' || Hse_Constants.strFileDownloadURL || 'download.pl?strSearchSeqID_=' || numSearchSEQ || '","tinywin","resizable=0,toolbar=0,menubar=0,status=1,width=775,height=500"); function closeWin() { timer = setTimeout("checkForOpener()", 10000); } function checkForOpener(){ try{ var myVar=window.opener.document; timer = setTimeout("checkForOpener()", 10000); }catch(e){ perlwin.close(); } } closeWin();</script>' Hi guys, I have read that the window.close won't work unless the window was opened through window.open. Eventhough I have the window opening through window.open method the window.close simply wont close the window. Below is my code. I appreciate you help as I am desperate to finish my project and this is the only thing between me and the closed project. I have this in the <head> in the parent window. Code: <script language="javascript"> function MM_openBrWindow(theURL,winName,features){ var left = (screen.width/2)-(800/2); var top = (screen.height/2)-(560/2); features = features + ",left=" + left; window.open(theURL,winName,features); } </script> the left and top is to center the window which is working. Then I have the below code in my button which is to open the window. Code: <input type="button" value="E-MAIL" onClick="MM_openBrWindow('email.php?camp_id=<?php echo $encrypted; ?>','','width=860,height=600'); return false"/> The $encrypted is created beforehand and the window gets opened as well. Now in the popup window... Up on submitting a form, I need the popup to close after saying 'email has been sent'. this is the code for calling the fuction Code: echo "<script language='javascript'>success();</script>"; I get the alert too. Code: function success(){ alert('E-Mail Sent Successfully'); window.close(); } I even get the alert mentioning "E-Mail Sent Successfully". But simply the window is not closed. Can you guys please shed me some light on this.... Your help is greatly appreciated Ohh and by the way I'm running FF8. Cheers E I am trying to get the total of the checkboxes selected when the user clicks the "calculate total" button. It isn't working though. What am I doing wrong? Code: <html> <head> <script type="text/javascript"> function calculate(f) { var nums = f.num; var ntext = f.numtext; var nitem = f.numitem; var result = 0; var items = ''; for(var i=0;i<nums.length;i++) { if(nums[i].checked) { result+=parseFloat(ntext[i].value); items+=nitem[i].value+'\n'; } } f.answer.value=result; } if (nums[i].checked) { window.alert("Your total is " + f.answer.value=result;); } </script> </head> <body> <style type="text/css"> .box1 { float:left; width:500px; clear:left; } .box2 { float:left; padding-left:50px; } </style> <form name="myform"> Build your own family meal<br> <div class="box1"> <input type="checkbox" name="num" onclick="calculate(this.form)"> <input type="hidden" name="numtext" value="24.00" onchange="calculate(this.form)"> <input type="hidden" name="numitem" value="pencil" onchange="calculate(this.form)"> <div class="box2">Chicken Enchiladas $24.00</div> </div><br> <div class="box1"> <input type="checkbox" name="num" onclick="calculate(this.form)"> <input type="hidden" name="numtext" value="15.00" onchange="calculate(this.form)"> <input type="hidden" name="numitem" value="pen" onchange="calculate(this.form)"> <div class="box2">Rice and Beans $15.00</div> </div><br> <div class="box1"> <input type="checkbox" name="num" onclick="calculate(this.form)"> <input type="hidden" name="numtext" value="6.00" onchange="calculate(this.form)"> <input type="hidden" name="numitem" value="paper" onchange="calculate(this.form)"> <div class="box2">Chips and Salsa $6.00</div> </div><br> <div class="box1"> <input type="submit" name="answer" value="Calculate Total" onclick="calculate(f)" /> </div> </form> </body> </html> Hi There, The following piece of code is working fine in IE6 but not in IE 8: if (Windowvar != null) { Windowvar.close(); } Windowvar= window.open(sUrl, 'static', viewerWinOption, true); To explain the functionality: 1. User clicks on one of the links on page 1 2. Clicking takes user from Page 1 to Page 2 (the transaction page). 3. Along with page 2, another page (Page 3) is opened. 4. User saves the transactions in the Page 2 and he is taken back to page 1 5. User clicks other link in Page 1 and activity in point 2 is repeated along with point 3 The issue is, when User clicks on the link AGAIN(for second transaction) in the Page 1 the Page 3 opens in the same browser window in the IE 6 but in IE 8 it opens in the differenct browser window (which shouldnt be happening) Any help will be appreciated. Regards, Sameer. Hi Guys, I have written a simple code to open up a new window onclick of a button as follows; Code: function loadExamp() { var reqType = getElementValue("reqType", 1); window.open("../jsp/loadExamples.jsp?reqType=" + reqType, "Connection Test Utility - Message Examples", "width=500,height=300,menubar=no,status=yes, location=yes,toolbar=no,scrollbars=yes" ); return; } The problem is that this code is working on Google Chrome but not in Firefox and IE. Why is that and how can I resolve this issue. I am using Firefox 3.6.11 and IE 8.0.XX. Also I tried to open a new window using <a href> option with the same URL and its working but the only problem is that I want to pass my next JSP an argument which is only possible with function or script. I googled it but couldn't find much information except that there is some security problem. For that I have disabled the 'Pop up Bloker' on both Firefox and IE but still not working. When I click my button there is no activity with 'Firefox' but IE gives me error as follows; Code: Message: Invalid argument. Line: 74 Char: 2 Code: 0 URI: http://localhost:8080/T24Utility/scripts/verifyCxPool.js Please help, Thanks, -- Sjunejo Hi, well i used soh tanaka inline modal window which is a popup window like lightbox. But it failed to work with IE9 RELEASED CANDIDATE VERSION. Can anyone tell me that why is it having issue with a better version of explorer. I have made a video to show the error, as to make it more easy to explain what i am saying. here is the link to it http://www.youtube.com/watch?v=pHi9ZlGyWc0 i would look forward to the replies. thank you. I am using JavaScript for popups in my OpenLayers map. All the html tags like <br> work in the popup window except for the link href tag. Everytime I put in a link in my popup window it doesnt work: Code: var mystring = "here is link:<br> <a href=\"www.sun.com\">link</a>"; popup = New OpenLayers.Popup.FramedCloud("chck", feature.coord, null, mystring, null, true, onPopupClose); Also tried link without quotes and with ticks and nothing seems to work with the link not taking me anywhere. Please advise. Can someone please help with this code. The window is supposed to automatically scroll and move but it isn't working. (It was taken from a discontinued book called javascript in 24hrs) The javascript: Quote: var pos=100; function Scroll(){ if (!document.getElementById ) return; obj=document.getElementById("thetext"); pos -=1; if(pos < 0-obj.offsetHeight + 130) return; obj.style.top=pos; window.setTimeout("Scroll();", 30); } //start scrolling when the page loads window.onload=Scroll; the css: Quote: #thewindow{ position:relative; width:180px; height:150px; overflow:hidden; border:2px solid red; } #thetext{ position:absolute; width:170px; left:5px; top:100px; } the html: Quote: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <link rel="stylesheet" type="text/css" href="scroll.css" /> </head> <body> <h1> scrolling window example</h1> <p>This example shows a scrolling window created using javascript and the w3cdom.The red border window is actually a layer that shows a cliped portion of a larger layer"</p> <div id="thewindow"> <div id="thetext"> <p>This is the first paragraph of the scrolling message.The message is created with regular html</p> <p>Entries within the scrolling area can use any html tags.They can contain <a href="#">links</a></p> <p> No limit to the number of paragraphs that you can include here...</p> <ul> <li>For example you could format items using a bulleted list.</li> </ul> <p>The scrolling ends when the last part of tht scrolling text ids on the screen.You've reached the end.</p> </div> </div> </body> </html> Code: <script language="JavaScript" type="text/javascript"> function confirmDelete(url){ var decision = confirm("Click OK to delete this post."); if(decision == true){ window.location = url; } } </script> <!--HTML LATER ON --> <a onclick="confirmDelete('deletePost.php?id=17')" href=''><img src='delete.png' alt='' title='Delete this post' /></a> I get absolutely nothing out of this. The confirm box pops up, but a the URL never changes when I click OK. I have no clue what's going wrong here. I'm using Google Chrome to test this out if that helps. Also does not work in Firefox. Everything up until the focus line works, any ideas? Code: else { alert ("Please enter your Postcode correctly, this includes:\n \n * Correct Spacing - AA1 1AA \n * Correct amount of letters and numbers. \n \n Sorry if this causes any inconvenience, but it is to your benefit."); document.delAdd.postcode.value = ""; document.delAdd.postcode.focus();} |