22 users online (0 members and 22 guests)  


  Results 1 to 10 of 10

Related

  1. Verifing Window 'size' upon Opening a File.    Forum: Javascript Forum
    Replies: 8
  2. Opening a new window    Forum: HTML Forum
    Replies: 12
  3. javascript-help with opening in frame window    Forum: Javascript Forum
    Replies: 1
  4. Page opening in new window - Help    Forum: HTML Forum
    Replies: 7
  5. problem with javascript opening a new window    Forum: Javascript Forum
    Replies: 4
  1. #1
    Ms.O's Avatar
    New User

    Status
    Offline
    Join Date
    Aug 2006
    Posts
    1

    Opening New Window

    Hi, I'm new to these forums and I need help. I need to know how to open a new browser window from a text link. The new window should be a certain width and height, with no additional attributes really.

    Here is the code I have pasted into the head of my page; this was generated by a little online code generator:

    <SCRIPT LANGUAGE="JavaScript">
    <!-- Thanks to Nic Wolfe http://fineline.xs.mw -->
    <!-- Begin
    function popup(URL) {
    day = new Date();
    id = day.getTime();
    eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width=800,height=300,left = 240,top = 362');");
    }
    // End -->
    </script>

    And here is the code I've copied to the text link itself:

    <A HREF="javascriptopup('http://www.onieward.com/eb.com/content/timeline/timeline.html')" class="nav">TIMELINE</A>

    I want this to open up the page timeline.html in a new window that's 800 x 300 pixels.

    Why, oh why won't this work? I have other javascript on that first page...is that conflicting with this somehow?

    I don't really know anything about javascript, so please be patient with me and really make your answers simple if possible....thanks.

    Thanks.
    Ms.O

  2. #2
    coothead's Avatar
    bald headed old fart

    Status
    Offline
    Join Date
    Aug 2003
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    732

    Re: Opening New Window

    Hi there Ms.O,

    and a warm welcome to these forums.

    First I must point out that a link like this...
    Code:
    <A HREF="javascript:popup('http://www.onieward.com/eb.com/content/timeline/timeline.html')" class="nav">TIMELINE</A>
    ...will mean that those who have javascript disabled - (about 10%) - will not be able to view your page.

    Try this coding which is a little more modern than that which you are using...
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title>very simple popup</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    
    <script type="text/javascript">
    <!--
    window.onload=function() {
     var mywindow;
     var features='width=800,height=300,left=240,top=362';
    document.getElementById('foo').onclick=function() {
    if(mywindow) {
       mywindow.close();
     }
       mywindow=window.open(this.href,'',features);
       mywindow.focus();
       return false;
      }
     }
    //-->
    </script>
    
    </head>
    <body>
    
    <div>
    <a href="http://www.onieward.com/eb.com/content/timeline/timeline.html" id="foo" class="nav">TIMELINE</a>
    </div>
    
    </body>
    </html>
    

  3. #3
    SeventhSon's Avatar
    New User

    Status
    Offline
    Join Date
    Oct 2006
    Posts
    9

    Re: Opening New Window

    This script is what I'm looking for, but when I add more links, only the first one opens a popup window. The rest just work normally. What am I missing?

  4. #4
    coothead's Avatar
    bald headed old fart

    Status
    Offline
    Join Date
    Aug 2003
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    732

    Re: Opening New Window


    Hi there SeventhSon,

    for multiple links try it like this example...
    Code:
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    
    <style type="text/css">
    <!--
    #container li {
        margin:10px 0;
     }
    a.popup  {
        font-family:verdana,arial,helvetica,sans-serif;
        font-size:16px;
        color:#000;
     }
    a.popup:hover {
        color:#f96;
     }
    -->
    </style>
    
    <script type="text/javascript">
    <!--
    
    window.onload=function() {
      var mywindow;
      var w=600;
      var h=400;
      var l=(screen.width-w)/2;
      var t=(screen.width-h)/2;
      var features='width='+w+',height='+h+',left='+l+',top='+t+',scrollbars=yes';
      var lnk=document.getElementById('container').getElementsByTagName('a');
    for(c=0;c<lnk.length;c++) {
    lnk[c].onclick=function() {
    if(mywindow) {
       mywindow.close();
     }
       mywindow=window.open(this.href,'',features);
       mywindow.focus();
       return false;
       }
      }
     }
    
    //-->
    </script>
    
    </head>
    <body>
    
    <ul id="container">
    <li><a class="popup" href="http://www.google.com">google</a></li>
    <li><a class="popup" href="http://www.ahfb2000.com/webmaster_help_desk/">webmaster forums</a></li>
    <li><a class="popup" href="http://www.w3c.org">w3c.org</a></li>
    <li><a class="popup" href="http://www.w3schools.com">w3schools</a></li>
    </ul>
    
    </body>
    </html>
    

  5. #5
    SeventhSon's Avatar
    New User

    Status
    Offline
    Join Date
    Oct 2006
    Posts
    9

    Re: Opening New Window

    Thanks for the quick response. The second script doesn't seem to work with what I'm trying to accomplish. What I have is a list of links on an image map and want the links to open in a popup when clicked.

  6. #6
    coothead's Avatar
    bald headed old fart

    Status
    Offline
    Join Date
    Aug 2003
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    732

    Re: Opening New Window


    Hi there SeventhSon,

    You, obviously, do not know how to adapt javascript to suit your requirements. ;
    I suggest that you post the code for your image map and I will adapt it for you.

  7. #7
    SeventhSon's Avatar
    New User

    Status
    Offline
    Join Date
    Oct 2006
    Posts
    9

    Re: Opening New Window

    You're right, I'm just beginning. I tried to adjust it to work, but anything I tried wouldn't work. Here's the code for my page:

    <html>
    <head>
    <meta content="text/html; charset=ISO-8859-1"
    http-equiv="content-type">
    <title>Home</title>
    </head>
    <body>
    <img src="http://sixtensouthelm.net/home/pictures-bg.jpg" usemap="#home"
    border="0">
    <map name="home">
    <area shape="circle" coords="1002,524,20"
    href="http://sixtensouthelm.net/home/215.jpg">
    <area shape="circle" coords="849,524,20"
    href="http://sixtensouthelm.net/home/148.jpg">
    <area shape="circle" coords="884,582,20"
    href="http://sixtensouthelm.net/home/99.jpg">
    </map>
    </body>
    </html>

  8. #8
    coothead's Avatar
    bald headed old fart

    Status
    Offline
    Join Date
    Aug 2003
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    732

    Re: Opening New Window

    Hi there SeventhSon,

    try it like this...
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title>Home</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    
    <style type="text/css">
    <!--
    body {
        background-color:#605050;
        color:#fff;
     }
    #container {
       text-align:center;
       margin-top:30px;
     }
    #container img {
        border:2px solid #302020;
     }
    -->
    </style>
    
    <script type="text/javascript">
    <!--
    
    window.onload=function() {
      var mywindow;
      var w=400;
      var h=400;
      var l=(screen.width-w)/2;
      var t=(screen.width-h)/2;
      var features='width='+w+',height='+h+',left='+l+',top='+t+',scrollbars=yes';
      var lnk=document.getElementById('container').getElementsByTagName('area');
    for(c=0;c<lnk.length;c++) {
    lnk[c].onclick=function() {
    if(mywindow) {
       mywindow.close();
     }
       mywindow=window.open(this.href,'',features);
       mywindow.focus();
       return false;
       }
      }
     }
    
    //-->
    </script>
    
    </head>
    <body>
    
    <div id="container">
    <img src="http://sixtensouthelm.net/home/pictures-bg.jpg" usemap="#home" alt=""/>
    <map id="home"name="home">
    <area shape="circle" coords="1002,524,20" href="http://sixtensouthelm.net/home/215.jpg" alt="">
    <area shape="circle" coords="849,524,20" href="http://sixtensouthelm.net/home/148.jpg" alt="">
    <area shape="circle" coords="884,582,20" href="http://sixtensouthelm.net/home/99.jpg" alt="">
    </map>
    </div>
    
    </body>
    </html>
    Your very small hot spots were very hard to find on your image map. I had to get my rule out to locate them.

  9. #9
    SeventhSon's Avatar
    New User

    Status
    Offline
    Join Date
    Oct 2006
    Posts
    9

    Re: Opening New Window

    Hey coothead

    Thanks. That did the trick. As far as the hot spots, they'll actually be one tenth that size when it's finished. I'm wanting them hard to find .

  10. #10
    coothead's Avatar
    bald headed old fart

    Status
    Offline
    Join Date
    Aug 2003
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    732

    Re: Opening New Window


    Hi there SeventhSon,

    I just noticed a minor error in the code that I posted.
    this line...
    Code:
      var t=(screen.width-h)/2;
    ...should be...
    Code:
      var t=(screen.height-h)/2;
    ...which will center the popup vertically.
    I apologize for the faux pas.




Tags for this Thread