SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Guru wii's Avatar
    Join Date
    Sep 2004
    Location
    Denmark
    Posts
    720
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Correct way to create a popup window ?

    What is best, like this:

    Code:
    <script type="text/javascript">
    <!--
    function popwindow()
    {
    window.open('http://www.mychat/chat','chat','width=770,height=540,menubar=no,scro llbars=no,toolbar=no,location=no,directories=no,re sizable=yes,top=50,left=50');
    }
    //-->
    </script>
    Code:
    <a href="javascript:popwindow()">Login the chatroom</a> (popup window)
    Or like this:

    Code:
    <a href="javascript: window.open('http://www.mychat/chat', 'chat', 'width=770, height=540, 
    menubar=no, scrollbars=no, toolbar=no, location=no, directories=no, 
    resizable=yes, top=50, left=50');">Login the chatroom</a>
    Or is there a better way than the 2 examples above? It needs to be as browser compatible as possible, and validate XHTML 1.0 Strict

    Thanks a lot.

  2. #2
    SitePoint Wizard Pepejeria's Avatar
    Join Date
    Jan 2005
    Location
    Too far up north
    Posts
    1,566
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Its alwasy better to have the JavaScript in one place, so I would recommend you the first solution. Note that users with JavaScript disabled will not see this popup.

    You can also skip the <!-- //--> if you want. That is used for ancient browsers that didn't recognize the script tag and outputted the code into the document.

  3. #3
    SitePoint Addict Mirek Komárek's Avatar
    Join Date
    Dec 2006
    Location
    Prague
    Posts
    210
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Maybe try to play with this, to see what will happen
    <script type="text/javascript">
    <!--//--><![CDATA[//><!--
    function hop(){ // for href with id which
    var which=document.getElementById('which');
    props='width=770,height=540,menubar=no,scrollbars=no,toolbar=no,location=no,directories=no,resizable=yes,top=50,left=50';
    which.onclick=function(){window.open(this.href,'win',props);return false;}
    }
    function hops(){ // for all links in div with id where
    var where=document.getElementById('where');
    var hrefs=where.getElementsByTagName('a');
    for(i=0;i<hrefs.length;i++){
    props='width=770,height=540,menubar=no,scrollbars=no,toolbar=no,location=no,directories=no,resizable=yes,top=50,left=50';
    hrefs[i].onclick=function(){window.open(this.href,'win',props);return false;}
    }}
    function init(){
    hop();
    hops();
    }
    if(document.childNodes){//kick off old browsers ie4,nn4
    window.onload=init
    }
    //--><!]]>
    </script>


    <div style="background:#ddd">
    <h2>This should popup, because has id which, first function is called</h2>
    <a href="http://www.google.com" id="which">google</a>
    </div>
    <div style="background:#eee">
    <h2>This should not popu no function on this link</h2>
    <a href="http://www.google.com">google</a>
    </div>
    <div id="where" style="background:#ccc">
    <h2>this links should popup, second function is called on all this links</h2>
    <a href="http://www.google.com">google</a>
    <a href="http://www.jyxo.cz">jyxo</a>
    </div>

  4. #4
    SitePoint Guru wii's Avatar
    Join Date
    Sep 2004
    Location
    Denmark
    Posts
    720
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Mirek, that works just fine, but isn´t the code a little overcomplicated for the same result, or does this have some advantages over the ones I posted ?

  5. #5
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,476
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

  6. #6
    SitePoint Wizard Pepejeria's Avatar
    Join Date
    Jan 2005
    Location
    Too far up north
    Posts
    1,566
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    One tip, there is no need to define the popup properties as "no". Since that is the default value.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •