JavaScript - How Can Invisible One Hyperlink Window
Hi,
I am going to open a new window on my web page , and run one link (which is important for me to be run ), then close that window after some seconds, but I do not want this window be visible by users. This is the code I used, but when I add visible= none, the function does not work, and my link cannot be run. <button onclick="myFunction()">Click</button> <script type="text/javascript"> function myFunction() { var win = window.open("link", '1366002941508','width=x,height=y,left=xx,top=yy', visible=none); setTimeout(function () { win.close();}, ss); } </script> I really appreciate for your suggestion ) Similar TutorialsHello, recently I have been to many government websites where I have noticed that the programmer has used window.open() method in JavaScript to link to different pages instead of using <a> tags! I was just getting curious to know whether it is normal or has it been used due to security concerns(if any, I don't know)? Any comments? Hi everyone. I'm new to the forum, and in need of help. The code below sometimes works the way I want it to...by downloading a video from an external site and displaying a placeholder whenever the page loads. But most of the time, the video won't download and display until a user hovers their mouse over the blank area. Is it possible to modify the code so that it functions consistently by always downloading and displaying the placeholder when the page loads? I don't want users to think there's a missing/broken video because there's a blank space where the video is supposed to be, and they don't realize they have to mouse over it. I would be grateful for any pointers. I searched the forums for a solution, but I don't think I'm using the correct keywords. Thanks so much for your help. Code: <a href="#" onclick="return(false);" rel="videoGUID=4cd75af679b39g4963V828c00c581024ae86&" style="display: block; width: 550px; height: 310px" id="4cd75af679b39g4963V828c00c581024ae86" width="550" height="310">How to Take Care of Your Dog's Teeth: VetVid Episode 001</a><script type="text/javascript" src="http://360.sorensonmedia.com/4cd75af679b39g4963V828c00c581024ae86/embedv2.js"></script> Made a topic earlier about "auto klick" for swf button but i got response ,its not posible todo that.. so i have another question!! Is it posible to make the swf button invisible but still clickable and then have a background so it looks like its another button? or is there any other way to edit design for the button! OBS! i only have the swf not the flv file! Code: <html class="no-js" lang="en" xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://www.facebook.com/2008/fbml"> <!--<![endif]--> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <script src="http://www.google.com/jsapi?key=ABQIAAAAAJ5I0tmbz-jcO3Ja4fwvEBTb9u7IFi28hLXI-qXjI6UBBcarTBQ49g-wp7Wxnow1_w9F-7_GcOOnyg"></script> <script> google.load("jquery", "1.7.0"); google.load("swfobject", "2.2"); </script> </head> <body> <div id="container"> <div id="main" role="main"> <div id="data" class="channel"> <div id="openbutton"> <div id="flashcontent1";></div> <!-- DR1 Start --><script> params = {}; params.text = 'DR1'; params.action = "channel"; params.value = "40"; swfobject.embedSWF('content/linkbutton.swf', 'flashcontent1', '145', '30', '9.0.115', 'content/expressinstall.swf', params, {allowFullscreen:'true', wmode: 'transparent' ,bgcolor: '#FFFFFF', menu: 'false'}, {id: 'flashcontent1'}); <!-- DR1 Ends --></script> </div></div></div> </div></body></html> I have a text input field that was created with JS on a screen. The input is padded with a 0 for the first character to work with the server. I was wondering if there is any way to make that 0 invisible so the user doesn't get confused?
Hello, I need your help. I would like to insert a few blank spaces in a text string: eg. string = 123456(space)(space)(space)7891011 How do you do this? Thanks a bunch Jay Hi I discovered something weird that happend to me when trying to add a javascript created table to the document.body. Basically it doesn't add it in IE, but works fine in FF. Actually it does add it in IE, but only shows up if I add a <br/> later in a new statement... What?!?! try my code to see what is going on. (works fine in FF, does bad thing in IE) I tried to narrow the code i was working with down to basics and still have the glitch happen so maybe it's just something wrong with this code, but i couldn't pinpoint it. Also, it's only when i do document.body.appendChild(), not document.body.innerHTML += entireMassiveElement.innerHTML; I need it to work in both browsers with the appendChild() method, because innerHTML is much slower. Any advice appreciated! Thanks! Code: <!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> <title>Interace v1.0</title> <style type="text/css"> /****************** * --Panel Style ******************/ .panel { } .panel table td {padding: 0px;} .panel_corner { background-color: #00c0ff; background-repeat: no-repeat; width: 3px; height: 3px; } .panel_sideX {height: 3px; background-color: #00c0ff; background-repeat: repeat-x;} .panel_sideY {width: 3px; background-color: #00c0ff; background-repeat: repeat-y;} .panel_topLeft {background-position: 0px 0px;} .panel_topRight {background-position: -3px 0px;} .panel_bottomLeft {background-position: -0px -3px;} .panel_bottomRight {background-position: -3px -3px;} .panel_top {background-position: -3px -6px;} .panel_right {background-position: -3px 0px;} .panel_left {background-position: 0px 0px;} .panel_bottom {background-position: -3px -9px;} .panel_main { background-color: #00c0ff; } .panel_titlebar { color: #ffffff; font-family: verdana; font-size: 10pt; padding: 3px; padding-top: 0px; overflow: hidden; /* display: none; */ } .panel_title { float: left; height: 18px; overflow: hidden; } .panel_buttons { float: right; } .panel_toolbar { background-color: #444444; color: #eeeeee; font-family: verdana; font-size: 10pt; padding: 3px; overflow: hidden; display: none; } .panel_content { overflow: auto; font-family: arial; color: #eeeeee; font-size: 7pt; font-weight: bold; padding: 10px; border: 1px inset #cccccc; background-color: #444444; } </style> <!--///////////////////////////////////--> <script type="text/javascript"> function makeElement() { var layout = document.createElement("table"); //the table that is the basic layout var top = document.createElement("tr"); var tl = document.createElement("td"); top.appendChild(tl); var tc = document.createElement("td"); top.appendChild(tc); var tr = document.createElement("td"); top.appendChild(tr); var middle = document.createElement("tr"); var ml = document.createElement("td"); middle.appendChild(ml); var mc = document.createElement("td"); middle.appendChild(mc); var mr = document.createElement("td"); middle.appendChild(mr); var bottom = document.createElement("tr"); var bl = document.createElement("td"); bottom.appendChild(bl); var bc = document.createElement("td"); bottom.appendChild(bc); var br = document.createElement("td"); bottom.appendChild(br); layout.appendChild(top); layout.appendChild(middle); layout.appendChild(bottom); layout.style.borderCollapse = "collapse"; tl.className = "panel_corner panel_topLeft"; tc.className = "panel_sideX panel_top"; tr.className = "panel_corner panel_topRight"; tl.style.padding = "0px"; tc.style.padding = "0px"; tr.style.padding = "0px"; ml.className = "panel_sideY panel_left"; mc.className = ""; mr.className = "panel_sideY panel_right"; ml.style.padding = "0px"; mc.style.padding = "0px"; mr.style.padding = "0px"; bl.className = "panel_corner panel_bottomLeft"; bc.className = "panel_sideX panel_bottom"; br.className = "panel_corner panel_bottomRight"; bl.style.padding = "0px"; bc.style.padding = "0px"; br.style.padding = "0px"; //-- Set up the cursors for the bottom, right, and bottomright sides to resize mr.style.cursor = "e-resize"; bc.style.cursor = "s-resize"; // --Now create the internal structure, titlebar, toolbar, content area var main = document.createElement("div"); var titlebar = document.createElement("div"); var toolbar = document.createElement("div"); var content = document.createElement("div"); content.innerHTML = "success!"; main.appendChild(titlebar); main.appendChild(toolbar); main.appendChild(content); mc.appendChild(main); main.className = "panel_main"; titlebar.className = "panel_titlebar"; toolbar.className = "panel_toolbar"; content.className = "panel_content"; //-- create the titlebar internals, title, buttons, cleardiv var title = document.createElement("div"); var buttons = document.createElement("div"); var clear = document.createElement("div"); titlebar.appendChild(title); titlebar.appendChild(buttons); titlebar.appendChild(clear); clear.style.clear = "both"; title.className = "panel_title"; buttons.className = "panel_buttons"; main.style.width = "200px"; return layout; } function go(select) { var stuff = makeElement(); if(select == 1) { //-- Add everything to the container document.body.appendChild(stuff); } else if (select == 2) { //-- Add everything to the container //layout is a table, but innerHTML only returns the inner, so i just added on the outer tags. document.body.innerHTML += ('<table cellpadding="0" cellspacing="0">' + stuff.innerHTML + '</table>'); } //document.body.innerHTML += "<br/>"; } </script> </head> <body> <input type="button" value="test append Element" onclick="go(1);"/><input type="button" value="test innerHTML add" onclick="go(2);"/> <body> </html> I am creating a customized home page that can display regular links and login forms. I am adding Gmail login form into it. I can further customize it by putting multiple sign in buttons that can fill in username/password for different accounts before submitting. Here's the preview: http://imgur.com/s4Ert.jpg Now the problem is, in Gmail login form a hidden variable called "dsh" is filled with a value that is matched with server as well as a cookie, this value changes in some hours. So this means that I cannot create a complete offline form, but is it possible to load the login page hidden, and catch the value from it? I tried with an iframe with display:none and src="http://mail.google.com" but it opened in the top frame. Any other ideas? In short, what we need is, every time a page is opened from my computer, an online page should be open invisible from the user, and a hidden form value is to be fetched from it. i have this code i need to close the parent.html window when the child window opened, i need the code for that working well in IE and Firefox Parent.html <HTML> <SCRIPT TYPE="text/javascript"> function sendTo() { window.open('child.html','_blank','resizable=yes,width='+(screen.width-500)+',height='+(screen.height-500)+''); } </SCRIPT> <BODY > <form name="form"> <input type="text" value="" name="text1" id="pdetails1"> <input type="text" value="" name="text1" id="pdetails2"> </br> <input type="submit" value="submit" onClick="sendTo()"> </BODY> </HTML> child.html <html> <body> <form> <input type=text name="text5" value=""> <input type=submit name="submit"value="submit"> </form> </body> </html> Hello all, and thank you for your coments, I want to preserve a 16/9 aspect ratio to the window after any resize, making the width a function of the height. As I have a window.resizeTo() inside the window.onresize event function, the infinite loop is served. How may I quit it? Code: <html><head><title>Title</title><script languaje="javascript"> const c_ra=16/9; window.onresize = function WindowReSize() { var myWidth = 0, myHeight = 0; if( typeof( window.innerWidth ) == 'number' ) { //Non-IE // myWidth = window.innerWidth; myHeight = window.innerHeight; } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) { //IE 6+ in 'standards compliant mode' // myWidth = document.documentElement.clientWidth; myHeight = document.documentElement.clientHeight; } myWidth = Math.floor(myHeight*c_ra); window.resizeTo(myWidth,myHeight); // ** CAUTION resize event in a onresize event handler ! }; </script></head><body><p>Hello World</p></body></html> hello everybody i need your help and experience for having code to show ( overlay / modal window ) to the user when closing or navigating away from the page ( i want put in this window facebook share to make the user to share the page in his facebook ) , bytheway i wanna use it in my wordpress in every post could it be happen ? Thanks for helping Here is the program: http://www.1728.com/newwindow.htm Basically, I want to input a number in the input box, which assigns a number to the variable numval located at document.box1.b1. When clicking on the "new window" button, an alert displays the input box value, then another window opens and displays the integers 1 through 12 and the amount squared. I would like the new window to obtain the number from the previous window so that the new window will display integers (and their squares) from 1 to the value of numval. I have the code below in my popup window which currently brings up a blank page in the background as the main window. Instead I want the popup to come up but the original page I left is in the background as the main window. Does anyone know how I can do that with the code I currently have. Code: <html> <head> <title>JavaScript Popup Example 3</title> </head> <script type="text/javascript"> function poponload() { testwindow = window.open("", "mywindow", "location=0,status=0,scrollbars=0,width=350,height=400"); testwindow.moveTo(0, 0); testwindow.document.write('<h1>Get outta here!</h1><a href="javascript:void(0);" onclick="window.opener.history.go(-1); self.close();">Parent back button</a>'); testwindow.focus(); } </script> <body onload="javascript: poponload()"> </body> </html> Hi Ive found out how to force another browser window to open at a certain size when a link is clicked. Here's the whole line of code including the layer, the javascript and the image, <div id="Layer6" style="position:absolute; width:10px; height:8px; z-index:6; left: 561px; top: 310px"><a href="javascript:;" onClick="MM_openBrWindow('navigation%20instructions.htm','','width=50,height=50')"><img src="images/info.gif" width="15" height="15" border="0"></a></div> How do I adapt this so I can also specify the x&y co-ordinates of the opened window relative to the window that launched it. thanks alot Masten Hi 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. I have created and opened a child window called "checkwin" and have written some data to it. If the data is valid, I want the user to click on the 'CONFIRM' button on the child window, at which time I want the "submit()" function for the form on the parent window to be executed. If the data is invalid the user clicks on 'MODIFY' and I want focus to return to a field on the parent form. However, when I click on the "CONFIRM" or "MODIFY" buttons on the child window, nothing happens. Here is the code: Code: checkwin.document.write("</td></tr><tr><td align='right'><input type='button' value='CONFIRM' onclick='opener.document.personnel_form.submit()'></td><td></td><td><input type='button' value='MODIFY' onclick='opener.document.personnel_form.first_name.focus()'></td></tr></table>") After following the instructions from the answer below: http://bytes.com/topic/javascript/an...arent-document I was able to have the child window perform the function defined in the parent window. The function was to only have an alert window pop up as the child page was loading. I easily modified this to my intention which was to have a parent function performed when the child window was clicked. Using the body tag: Code: <body onclick="parent.FUNCTION NAME HERE()"> I first change the method in which the function would be triggered, all went well there. then I tried to change which function would be triggered. (Basically use the function I wanted to happen on click of the child window rather then the function from the test). Once I did this switch, nothing happens. The site this is being used on is: http://tylerpanesar.ca/ What I want is when the menu bar is open in the parent window, the user chooses a link and the menu closes and goes to that link in the child window. This already works. However if the user opens the menu bar and then changes there mind and continues with the page the are currently on (clicks any content in the child window), the menu stays open. Currently the menu "hides" only when you choose one of the menu items, but it does not "hide" when you CLICK on child document. If you could figure out how to get it to "hide" on a "mouse out" that would be the better option. I attempted this method however i could only get it to "toggle" the menu on "mouse out". This method does however create an annoying flicker when you hover over the menu items (as it is toggling the open menu command I guess). If I had it "hide" the menu on "mouse out" it would "hide" as soon as you moved off of the main button. The viewer doesn't even have a chance to click a link. or at least that is what happens when I did it. You may have a better method to achieve this. The script that tells it to hide on click is within a jQuery function: Code: menua .click( function(){ menu.hide(); the code I used for the mouseout toggle was: Code: menu .mouseout( function(){ menu.toggle(); Here is the script that I am currently using for the menu to open and the "click" hide feature. This menu feature comes from the following help: http://www.bennadel.com/blog/1740-Bu...-FaceBook-.htm Code: <script type="text/javascript"> jQuery(function( $ ){ var menuRoot = $( "#menu-root" ); var menu = $( "#menu" ); var menua = $( "#menu a" ); // Hook up menu root click event. menuRoot .attr( "href", "javascript:void( 0 )" ) .click( function(){ // Toggle the menu display. menu.toggle(); // Blur the link to remove focus. menuRoot.blur(); // Cancel event (and its bubbling). return( false ); } ) ; menua .click( function(){ // Toggle the menu display. menu.hide(); } ) ; // Hook up a click handler on the document so that // we can hide the menu if it is not the target of // the mouse click. $( document ).click( function( event ){ // Check to see if this came from the menu. if ( menu.is( ":visible" ) && !$( event.target ).closest( "#menu" ).size() ){ // The click came outside the menu, so // close the menu. menu.hide(); } } ); }); </script> I've tried adding the click to "hide" menu feature to the child document but there is now menu in that document for it to "hide". What I was trying to was have the child document execute a function from the parent document and have that function executed IN the parent document. I've tried the technique from the link in my very first post but I believe it only calls the function from the parent and executes it IN the child. Which does not work for me as the menu is not in the child. There should be a way to make the child execute a function FOR the parent. I apologize for this very wordy post, but I am extremely frustrated with this now as I have been trying to get this to work for a few weeks now. Any help would be greatly appreciated. Thanks in advance, Tyler I am looking to have a link open a closeable window that is contained within a browser window. If you click on the "sizing charts" link on this website, this is exactly what I am looking to do: http://www.bella.com/mapper.php?pageid=40 The window is contained within the current browser window, it can be dragged around, but not outside the parameters of the browser window. Is there a title for this technique that I can research? Not looking to waste anybodys time, but if I can get steered in the right direction it would be greatly appreciated. Thanks For a parent window opened a child window, how can the parnet window be notified when the child window is closed or terminated? Thank you. I am using a window.open to trigger a mailto: command. I don't want the window to stay open so I try to close it right after. The default email client launches correctly, but the window stays open and I get the following Javascript error: Unable to get value of the property 'close': object is null or undefined Code: Code: var win = window.open(mailto_link,'emailWindow'); win.close(); In my main window, I create a popup window. Is there a way to bring the main window back to the foreground (make the main window the focus window again) from the popup window using JS? Like from a link or a button? Thanks |