[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 4090
  • Last Modified:

Pageviewer webpart dynamic resizing

Hello,

I would like to know how to resize a sharepoint pageviewer webpart content dynamically. Scenario below -
I have installed WSS 3.0 and created a site(menu) ABC and inserted a pageviewer webpart and redirect URL :\abc.aspx(located on the same server), and also I inserted a content editor webpart to add scripts.
I need the abc.aspx page to fit in dynamically according to the screen resolution, how could this be done, any help will highly appreciated.
Please provide scripts so that I can test it

Regards,
Roy
0
roisroy
Asked:
roisroy
  • 2
1 Solution
 
roisroyAuthor Commented:
I am still searching for a solution!
Experts pls respond

Regards,
Roy
0
 
Ted BouskillSenior Software DeveloperCommented:
The Page Viewer Web Part is essentially an IFRAME, however, Sharepoint might implement some tricks to force it to fit in the page.  If you can't control the IFRAME using CSS then I suspect it can't be done.
0
 
dp_expertCommented:
You can do it using JavaScript code. Generally you need to add the "window.onresize " tag to your script and fire some function with it what will change the dimensions of your IFrame.
Depending on your needs you will have to calculate the IFrame size appropriately to the object it is nested in. Make sure the main object is changing it's size dynamicaly to fit the page size (so for ex. height and width set to 100%.).
I would recomend switching from the web page viewer to the simply putting your code on the page - it will be easier for you to control the iframe. Use the SPD to put the code from the snippet on our page.
Using web parts for this might be complicated - webparts do not scale to fit the page in heigth - they tend to scale to 0. So you either need to artificialy pump their heigth or not use web part and put the code on page with SPD.
 

<table cellspacing=0 cellpadding=0 border="1" height="100%" width="100%"><tr><td id="td_with_iframe"><iframe id="iframe" src="http://www.datapolis.com"></iframe></td></tr></table>
  <script> 
  //attach the setIframeDimensions() function to the window resize event
  window.onresize=setIframeDimensions;
 
  //set the iframe object
  iframe_obj=document.getElementById("iframe");
  
  //fire the function to fit the iframe when page loads
  setIframeDimensions();
  //define the setIframeDimensions function that will resize the Iframe in relation to the nesting object
  function setIframeDimensions()
  {
	
	//scale down the iframe to get the real parent size (in case of resizing down)
	iframe_obj.height="1";
	iframe_obj.width="1";
	
	//scale to parent size
	iframe_obj.height=iframe_obj.parentNode.clientHeight;
	iframe_obj.width=iframe_obj.parentNode.clientWidth;	
  }
	
	</script>

Open in new window

0
 
roisroyAuthor Commented:
Dear DB_Expert,
Thanks for the script and suggestions, I will try it and get back to you.
Regards,
Roy
0

Featured Post

Visualize your virtual and backup environments

Create well-organized and polished visualizations of your virtual and backup environments when planning VMware vSphere, Microsoft Hyper-V or Veeam deployments. It helps you to gain better visibility and valuable business insights.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now