SharePoint 2020

The Vision for a Future of Clarity

How to Open a Pop-up Dialog Maximized Fullscreen

This is a great way to open links on your page without using Browser tabs or “Open in New Window” options.

This feature enables a specified link, when clicked to open in a dialog window with one extra feature, it opens in Maximized View to the exact dimensions of the users monitor.

I find this method is more user friendly, great for hiding the URL of the dialog content and perfect for showing PDF files while still keeping the user on your site.

Fullscreen SharePoint Dialog

First test this code in a html page and attach it as a Content Editor Web Part first, just to make sure everything is working.

<style type="text/css" >
#wrapper {
 width: 960px;
 margin: auto;
}
html.ms-dialog #wrapper {
 width: 100%;
}
</style>

<script type="text/javascript" >
function openDialog(strPageURL) {
var options = {
url: strPageURL,
showMaximized: true,
width: 800,
height: 500,
title: "Title of Dialog" };
SP.UI.ModalDialog.showModalDialog(options);
}
</script>

Once this code is pasted in use the following with your hyper link:

<a onclick='javascript:openDialog("/server/teamsite/document.pdf");javascript:return false;' href="#" target=_self> Click to Open</a>  

So on each hyper-link you just add this extra code to your URL for it to open in a maximized dialog window.

Please let me know if the code helps you in your SharePoint Enviroment or if you have any questions, just comment below.

* I’ve tried to find the site where I first obtained this code to give credit but cannot find which site I gathered most of the code from.

Advertisements

February 15, 2013 - Posted by | SharePoint 2010, SharePoint Designer 2010 | , ,

1 Comment »

  1. Nica article. Maybe this is a good way to show dialogs for mobile clients

    Comment by M F Ninja | November 10, 2014 | Reply


Post a Comment

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: