Make Page Viewer or Other Web Parts, Full Screen

When you create a web-part page and add a page-viewer, it doesn't want to go to the full-size of the window. Here are some steps to get it fitted to the full size of anyone's window.

1. Create a new Web Part page with "Full Page, Vertical" layout template.

2. Drop a Page Viewer Web Part on the page and in the settings, ch

oose Web Page and in the Link, type in the external URL e.g. http://www.microsoft.com

Hit OK to let the Page Viewer Web Part load the URL.

3. As you can see the Page Viewer Web Part loads the page in a restricted area in the screen although we have additional height available.

4. Drop a Content Editor Web Part just below the Page Viewer Web Part:

5. In the tool pane for Content Editor Web Part, click on Source Editor as we would write the JScript code in the source editor.

6. Paste the following JScript code in the Source Editor and click on OK to close the Source Editor. Once it looks good, there is an option in here to "hide" this web-part so you don't see it and the code does it's thing behind the scenes.

 <script language="javascript">  
        var a = MSO_ContentTable.getElementsByTagName("table");  
        MSO_ContentTable.setAttribute("height","100%");  
        for(i=0;i<a.length;i++)  
        {  
          a[i].setAttribute("height","100%");  
        }  
        var z = document.getElementsByTagName("div");  
        for(i=0;i<z.length;i++)  
        {  
          if(z[i].id.indexOf("WebPartWPQ",0) >=0 )  
          {  
            if(z[i].hasChildNodes())  
            {  
              if(z[i].firstChild.nodeName.toUpperCase() == "IFRAME")  
              {  
                z[i].firstChild.setAttribute("height","100%");  
             }    
           }  
          }  
        }  
 </script>  

7. Click OK again to close the Content Editor Web Part's tool pane.

8. Click on "Exit Edit Mode" link to see the actual effect of the JScript code.

Now you should be able to see the Page Viewer Web Part taking the full available screen height:

You can actually mark Content Editor Web Part as "Hideen" (Tool Pane > Layout > Hidden) and it would not show up on your page but still execute the JScript code and get your Page Viewer Web Part as a full height control.

Enjoy!