JavaScript - Opening A Contained Closable Window Within Browser Window

Hey Guys,

I feel like a complete idiot posting this, but I clearly am missing something. I'm trying to open a window with the specs below but all it does is open a standard sized window.

Any help would be greatly appreciated.

Code:

<SCRIPT LANGUAGE="javascript">
function open_window() {
window.open ('https://domain.com/document.php','newwindow',config='height=418,width=590,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,directories=no,status=no')
}
</SCRIPT>
                
<p><a onclick="open_window()"><img src="images/image.png" width="142" height="113" /></a></p>

I am trying to write a javascript to open multiple websites in the same window for Internet Explorer. However I keep getting the website opening in a new window.

Here is my code.

Code:

var url = [
"http://www.google.com",
"http://www.yahoo.com",
"http://www.msn.com"
];

var interval = 3000;
var startTime = 0;
for (i = 0; i < url.length; i++) {
    startTime = startTime + interval;
    setTimeout("openWindow("+i+")", startTime);
}

function openWindow(num) {
	window.open(url[num],'mywindow','width=800,height=600,menubar=yes,status=yes,location=yes,toolbar=yes,scrollbars=yes');
}

So currently, this code behaves like this. Every 3 seconds, it opens up a new website. However this code I wrote opens google.com in a new window, then yahoo.com in a new window and so on.

I want it to open all the websites in the same window. How do I achieve this?

I haven't been able to find anything about this on here or clear direction on the net, so I'm hoping y'all can help me out.

I have a dropdown list that I use to navigate pages on an external website. Currently, my dropdown list will open a new page in my current window. I want to be able to open the page in a new window.

I'm sure it's a simple fix, but being somewhat of a noob to Javascript I can't figure out how to solve it.

Here's what I have for the navigation dropdown:

Code:

<FORM 
     ACTION="../cgi-bin/redirect.pl" 
     METHOD=POST onSubmit="return dropdown(this.gourl)">
<SELECT NAME="gourl">

<OPTION VALUE="">Make Your Selection
<OPTION VALUE="http://url1.html>Choice 1
<OPTION VALUE="http://url2.html>Choice 2
<OPTION VALUE="http://url3.html">Choice 3

</SELECT>

<INPUT TYPE=SUBMIT VALUE="Go">
</FORM>

And here's what I have in the header:

Code:

<SCRIPT TYPE="text/javascript">
<!--
function dropdown(mySel)
{
var myWin, myVal;
myVal = mySel.options[mySel.selectedIndex].value;
if(myVal)
   {
   if(mySel.form.target)myWin = parent[mySel.form.target];
   else myWin = window;
   if (! myWin) return true;
   myWin.location = myVal;
   }
return false;
}
//-->
</SCRIPT>

Any ideas?

Hi,

I am using Javascript to display options in a form with 2 dropdown lists. However, despite using the rel="nofollow" target='_self', the result opens in a new window. Help would be much appreciated.

Code:

// JavaScript Document
function setOptions(chosen) {
var selbox = document.ChronoContact_course_finder.opttwo;
 
selbox.options.length = 0;
if (chosen == ' ') {
  selbox.options[selbox.options.length] = new Option('Choose Option',' ');
 
}
if (chosen == '85') {
  selbox.options[selbox.options.length] = new Option('ITEC Beauty Specialist Diploma','index.php?option=com_content&view=article&id=49&Itemid=68',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('ITEC Professional Makeup','index.php?option=com_content&view=article&id=57&Itemid=76',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('Fashion Catwalk & Photographic Makeup Course','index.php?option=com_content&view=article&id=67&Itemid=91',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('Bridal Makeup Course','index.php?option=com_content&view=article&id=68&Itemid=92',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('Special Effects Makeup','index.php?option=com_content&view=article&id=56&Itemid=77',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('Gel Nails Course','index.php?option=com_content&view=article&id=65&Itemid=88',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('Acrylic Nails Course','index.php?option=com_content&view=article&id=66&Itemid=89',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('Spray Tanning Course','index.php?option=com_content&view=article&id=55&Itemid=73',rel="nofollow" target='_self');  
}
if (chosen == '69') {
  selbox.options[selbox.options.length] = new Option('ITEC Holistic Massage Course','index.php?option=com_content&view=article&id=51&Itemid=2',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('ITEC Sports Massage Diploma','index.php?option=com_content&view=article&id=59&Itemid=78',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('Indian Head Massage Course','index.php?option=com_content&view=article&id=60&Itemid=79',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('ITEC Reflexology Diploma','index.php?option=com_content&view=article&id=64&Itemid=87',rel="nofollow" target='_self');
}
if (chosen == '80') {
  selbox.options[selbox.options.length] = new Option('ITEC Teaching Diploma','index.php?option=com_content&view=article&id=61&Itemid=81',rel="nofollow" target='_self');
  selbox.options[selbox.options.length] = new Option('FETAC Train The Trainer Level 6','index.php?option=com_content&view=article&id=63&Itemid=86',rel="nofollow" target='_self');
}
if (chosen == '83') {
  selbox.options[selbox.options.length] = new Option('ITEC Sports Massage Diploma','index.php?option=com_content&view=article&id=59&Itemid=90',rel="nofollow" target='_self');

}
}

And the HTML...

Code:

<div class="form_item">
  <div class="form_element cf_heading">
    <h1 class="cf_text">course finder</h1>
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 200px;">Step 1: Choose type of course</label>
    <select name="optone" class="cf_inputbox" size="1" onchange="setOptions(document.ChronoContact_course_finder.optone.options[document.ChronoContact_course_finder.optone.selectedIndex].value);">
      <option value=" " selected="selected">Choose Option</option>
      <option value="85">Beauty courses</option>
	  <option value="69">Complimentary courses</option>
	  <option value="80">Teaching courses</option>
	  <option value="83">Fitness courses</option>	  

    </select>
    
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_dropdown">
    <label class="cf_label" style="width: 200px;">Step 2: Choose a subject</label>
    <select size="1" name="opttwo" class="cf_inputbox" >
    <option value=" " selected="selected">Choose Option</option>
      
    </select>
    <!--<input type="button" name="go" value="Value Selected" onclick="window.open(document.ChronoContact_course_finder.opttwo.options[document.ChronoContact_course_finder.opttwo.selectedIndex].value);">-->
  </div>
  <div class="cfclear">&nbsp;</div>
</div>

<div class="form_item">
  <div class="form_element cf_button">
    <input type="submit" name="go" value="search" onclick="window.open(document.ChronoContact_course_finder.opttwo.options[document.ChronoContact_course_finder.opttwo.selectedIndex].value);">
  </div>
  <div class="cfclear">&nbsp;</div>
    
</div>

Many thanks,
Paul

hey guys
im just building a portfolio website for my self and i wanted to create something that could work well across a number of devices and screen sizes.
i recently came across this website http://tillwiedeck.com/ and noticed that the menu positions itself according to the size of the browser window. This works really well when viewing it on devices such as ipads and iphones. My question is that does anybody know if there is any way i could make an object always position itself at say 25% of the windows width and another object always position itself at 75% of the windows width. really hope i'm making myself clear.

thanks heaps

Hello, I was wondering if there is a way to prevent the browser window from scrolling when you are scrolling inside an overflow auto div and reach the end of the div's scroll? Right now I have a few people complaining about a div that loads scrolling info on the screen and when they scroll down using the mouse wheel and get to the bottom of the div then the rolling of the mouse wheel starts scrolling the browser window. It would be nice if the browser could see that your cursor is over the div and even though it reaches the end, not scroll the window unless you move the cursor outside of the div that you are currently scrolling.

Any ideas or is this just something we have to deal with?

Thanks

Hi, this will probably make a bit more sense it you read my topic in the HTML section (http://www.codingforums.com/showthread.php?t=57093) where I had a problem with two floating divs, in the end the solution was to give both on my floating divs a fixed width. Now, the menu bar div will always be 150 pixels and i wanted the remaing width to be taken up by the main content div.

This script here seems to work very wel in firefox but in ie I get scrollbars. This seems to be because firefox returns the actuall width of the viewing 'frame' while IE seems to give the width of the window itself.

PHP Code:
<script type="text/javascript">
onload = function getBrowserWidth() {
    if (!document.all) {
    var width = document.body.offsetWidth;
    var newWidth = width - 150;
    document.getElementById('main').style.width = newWidth;
    }
}
</script> 


After a bit of playing with it I found that IE seems to return in offsetWidth about 19 more pixels than the actual size of the viewable 'frame', can anyone confirm this?
Now, when the browser window is resized I want the width of the element to be resized as well, which meant I had to add to the body tag <body onresize="getBrowserWidth();"> is there a better way to attach the function to when the window is resized?
I am not sure how Opera and Safari return offsetWidth and if they do it like mozilla, or need special values like IE does to make it fit.

Thanks for all of your help with any of these 'mini' questions

Hello,

First I want to say I have no experience with coding, I develop eLearning via Adobe Captivate. We recently implemented a new LMS from PeopleSoft. This new LMS is launching the eLearning in a small browser window probably 500x400 without the ability to resize this.

I am wondering first, if it's possible to edit the htm/js file that Captivate produces, and if anyone is aware of code that could then be entered into the htm/js file to resize the browser upon launch?

Thanks!

Dear All,
I have downloaded some code from a javascript programmers website but having trouble making it work!

I have some javascript:

[CODE]

<SCRIPT TYPE="text/javascript">
<!--
function dropdown(mySel)
{
var myWin, myVal;
myVal = mySel.options[mySel.selectedIndex].value;
if(myVal)
{
if(mySel.form.target)myWin = parent[mySel.form.target];
else myWin = window;
if (! myWin) return true;
myWin.location = myVal;
}
return false;
}
//-->
</SCRIPT>

[CODE]

Within the main body, my code reads:
[CODE]

<FORM
ACTION="../cgi-bin/redirect.pl"
METHOD=POST onSubmit="return dropdown(this.gourl)">
<SELECT NAME="gourl">
<OPTION VALUE="">Please select your event...
<OPTION VALUE="http://www.yahoo.co.uk"> preview yahoo UK</option>
<OPTION VALUE="http://www.yahoo.com"> preview yahoo US</option>
<OPTION VALUE="http://www.yahoo.fr"> preview yahoo FR</option>
<OPTION VALUE="http://www.expedia.co.uk"> preview Expedia</option>
<OPTION VALUE="http://www.travelocity.co.uk"> preview Travelocity</option>
<OPTION VALUE="http://www.onlinepictureproof.com"> preview online pics</option>
</SELECT>
<INPUT TYPE=SUBMIT VALUE="Go">
</FORM>

[CODE]

On selection of "preview yahoo UK" from drop-down box, it takes me to the correct webpage (www.yahoo.co.uk), so no issue there. However, it opens this page up in a new window. I'm pretty sure this is because the javascript code is telling it to. However, I want the www.yahoo.co.uk page to be displayed in the same window from where the request came from? (i.e. I don't want it to open a new browser window)!

What do I have to change in the javascript to make this happen? I tried using the TARGET functionality taught to me many many moons ago, but it still fires up a new window: <OPTION VALUE="http://www.yahoo.co.uk" TARGET="_top"> preview yahoo UK</option>

I am testing this on my PC, so perhaps it could be that redirect.pl isn't held locally on my home pc, i.e. it would work once we upload the web pages to the web server?!

any help/guidance would be greatly appreciated.

Hi,

I am trying to get the Chrome Height of a browser window.
I tried window.outerHeight - window.innerHeight
but that gives me the height of the chrome plus the status bar.

Does anyone know of a way to just get the height of the chrome of a browser window?

Or, get the screen coordinates of the inner body of the browser window. Because, then I can subtract those coordinates from screenX and screenY.

Thanks for your help.

Hi!

I need to open a window when:
1 user leaves the site
2 when the browser is closed.
I tried the 'unLoad' event but it works only for the user leaves site case and not the browser close. Here is the code I tried:
<html>
<head>
<title>Detecting browser close </title>
<script type="text/javascript">
function doUnload()
{
myWin= open("exit_site.php", "exitWin", "width=50,height=50");
}
</script>
</head>

<body onunload="doUnload()"
<h4>Close browser!</h4>
</body>
</html>

Neep your help, please

Hi folks,

I've got a chat program which relies on a column in a MySQL database to see if he/she has logged out or not. But if you close the browser window, the computer still thinks you're online. I wrote this in the JavaScript section cos I think it would definitely need Javascript. So any help for updating the database in any way? Thanks!!

Lucas

Hi

I am a new bie to Javascript programming. We have a scenario to launch a new browser window for a given HTML. I have the following approaches :

Approach 1:
my_window = window.open("", "report");
my_window.document.open();
my_window.document.write("<HTML> <BODY> HI </BODY></HTML>");
my_window.document.close();

Approach 2:
var newWindow = window.open("", "report");
newWindow.document.body.innerHTML = "<HTML> <BODY> HI </BODY></HTML>";

Could anyone sugges Which is the correct approach ? Our requirement is to have this code to work in any browser?

Thanks

I have found this Alarm Clock from JavaScript Kit and when the alarm time is reached it redirects to the URL entered. I would like to keep the alarm clock running, have it open a new window for the entered URL such as (Target="Blank") in HTML. Can someone help?

var jsalarm={
padfield:function(f){
return (f<10)? "0"+f : f
},
showcurrenttime:function(){
var dateobj=new Date()
var ct=this.padfield(dateobj.getHours())+":"+this.padfield(dateobj.getMinutes())+":"+this.padfield(dateo bj.getSeconds())
this.ctref.innerHTML=ct
this.ctref.setAttribute("title", ct)
if (typeof this.hourwake!="undefined"){ //if alarm is set
if (this.ctref.title==(this.hourwake+":"+this.minutewake+":"+this.secondwake)){

window.location=document.getElementById("musicloc").value

}