SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    Non-Member
    Join Date
    Jan 2003
    Posts
    866
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Resizing current window

    Anyone have some code handy that would resize a window after it opened? I know how to use a JS function to open a new window of a specific size, but I am trying to remove all JS from the linking pages and have it all contained in just the one document that needs to be resized. Any help would be appreciated.


  2. #2
    SitePoint Addict
    Join Date
    May 2000
    Posts
    313
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Have you tried - window.resizeTo(400,500)

    The first number is the width and the second number is the height. You could place it in a function that gets called by the onLoad event.

  3. #3
    Non-Member
    Join Date
    Jan 2003
    Posts
    866
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm really JS newbie. Where would the onLoad event go? In the script definitions in the head tag?

  4. #4
    SitePoint Zealot
    Join Date
    Jul 2002
    Location
    Fort Lauderdale
    Posts
    123
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by techmonkey
    Where would the onLoad event go? In the script definitions in the head tag?
    In the body tag.

    www.unpossiblemedia.com - A Fort Lauderdale based multimedia company.

  5. #5
    SitePoint Addict
    Join Date
    Aug 2001
    Location
    Los Angeles, CA
    Posts
    346
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here's a script that I wrote a few months ago and has been really, REALLY useful:

    Code:
    <html>
    <head>
    <title>Script</title>
    <Script language="JavaScript">
    function resizeWin()
    {
    this.window.resizeTo(800,600);
    var screen_height = window.screen.availHeight / 2;
    var screen_width = window.screen.availWidth / 2;
    this.window.moveTo(screen_width - 400, screen_height - 300);
    }
    </script>
    </head>
    <body onload="resizeWin()">
    The size of this window is 800x600 pixels....
    </body>
    </html>
    What this script does is resize the browser window to 800x600 pixels, and then centers it on the visitor's screen. It works in Internet Explorer, Netscape, Opera, pretty much every browser...I haven't seen it not work in a certain browser yet.

  6. #6
    Non-Member
    Join Date
    Jan 2003
    Posts
    866
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Great thanks!

  7. #7
    Non-Member
    Join Date
    Jan 2003
    Posts
    866
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    function resizeWin()
    {
    this.window.resizeTo(250,600);
    var scrollbars = no;
    var screen_height = window.screen.availHeight / 2;
    var screen_width = window.screen.availWidth / 2;
    this.window.moveTo(screen_width - 400, screen_height - 300);
    }

    This all works except for the scrollbar part. Anyone know how to remove the scrollbars, toolbar etc in a function like this?

  8. #8
    SitePoint Addict
    Join Date
    Aug 2001
    Location
    Los Angeles, CA
    Posts
    346
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Alright here you go, techmonkey:
    Code:
    <html>
    <head>
    <title>Script</title>
    <Script language="JavaScript">
    function openAndResize(pageName, extension)
    {
    var child_window = window.open(pageName+"."+extension,"newWin","toolbar=no menubar=no scrollbars=no" );
    child_window.resizeTo(250,600);
    var screen_height = window.screen.availHeight / 2;
    var screen_width = window.screen.availWidth / 2;
    child_window.moveTo(screen_width - 125, screen_height - 300);
    child_window.focus();
    }
    </script>
    </head>
    <body onload="openAndResize('testing1','html')">
    The size of this window is 250x600 pixels....
    </body>
    </html>
    This script basically opens a pop up (you specify the page name and the file extension when you call the function), resizes it to 260x600 and centers it on the screen. It also removes the tool bar, the menu bar, and the scrollbars from the pop up. You should have this code in your parent window, and it will open every pop up exactly the way you want... This code here displays testing1.html in the pop up (notice the onload attribute inside the body tag...it calls the function and specifies the two parameters -- the page name and the web page file extension).

  9. #9
    Non-Member
    Join Date
    Jan 2003
    Posts
    866
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for the reply gregc.

    I don't need to open a new window. I have a unique circumstance in which I need the current window resized. The code above accomplishes this, but I am unsure where to put the scrollbars, toolbar, etc values.

  10. #10
    SitePoint Addict
    Join Date
    Aug 2001
    Location
    Los Angeles, CA
    Posts
    346
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well, I don't think there is a way to take away the toolbar and menu bar from the current parent window...as far as I know, this can only be done when opening a pop up.

  11. #11
    SitePoint Wizard Bill Posters's Avatar
    Join Date
    Dec 2001
    Location
    UK
    Posts
    1,523
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Fwiw (& imho) it's better to have the window resizing enacted *before* the body has begun to load.
    By setting and triggering the function in the header you save the user from having to sit through a 'clumsy' resize event where entire content may shift or resize, possibly forcing the vistor's focus to have to relocate.

    It's much better to establish the window size early on so that the content renders in position first time. That way the visitor's attention can settle and stay on the loaded content while the rest of the page is still loading.

    It's a small usability/user-friendliness point, but one worth bearing in mind, imho.

    New Plastic Arts: Visual Communication | DesignateOnline

    Mate went to NY and all he got me was this lousy signature


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
  •