The first two links in the footer are simple HTML links (which happen to be relative links, so in this HTML code copied from the Cleveland Clinic site, they link to the home of the Instruct server, and to a non-existing page.)
The "Disclaimer" and "Privacy Statement" links are the ones we are interested in. Both of these links use JavaScript to open new windows. They use the JavaScript window.open method rather than a simple hyperlink target attribute so that they can:
href parameter), unlike event parameters, normally does not contain JavaScript code, the
href parameter value uses the JavaScript keyword, like this:
<a href="JavaScript:disclaimer();"> /home/disclaimerpopup.htm.target attribute, the value of "_blank" could be used to assure that a new window is always opened,
but in this case, a target window name of "Disclaimer" is specified.toolbar=no - omit the main browser window toolbar,
location=no - omit the address toolbar,
resizeable=no - don't allow the user to resize the window (please note that it is generally best to allow the user to resize the window, in case the destination page turns out to be larger
or the user sets the text to a larger font than the author of the
source page expected.)width=500,height=300 - specify the height and width of the window, in pixels.
Here's the HTML & Javascript code for the footer (omitting styling):
<script type="text/javascript" language="JavaScript">
function Disclaimer() {
// Invoke window.open to open the disclaimer in a 500x300 window
hist_window = window.open('http://www.clevelandclinic.org/home/popupdisclaimer.htm',
'Disclaimer',
'toolbar=no,location=no,scrollbars=yes,resizeable=no,width=500,height=300');
}
function PrivacyStatement() {
// Invoke window.open to open the Privacy Statement in a 500x650 window
hist_window = window.open('http://www.clevelandclinic.org/home/popupprivacy.htm',
'PrivacyStatement',
'toolbar=no,location=no,scrollbars=yes,resizeable=no,width=500,height=650');
}
</script>
<div class="footer">
<a href="/" target="_top">Cleveland Clinic Home</a> |
<a href="/contact/">Contact s</a> |
<a href="javascript:Disclaimer();">Disclaimer</a> |
<a href="javascript:PrivacyStatement();">Privacy Statement</a> |
© Cleveland Clinic 2006
</div>
And the footer looks like this:
With either the Disclaimer link or the Privacy Statement link, you'll see that
<script type="text/javascript" language="JavaScript">
function openNewWindow(url,windowName,width,height) {
// use window.open to open target link, with the URL, Window Name, Width, and Height passed as parameters.
// The URL and Window Name are used as the first two parameters to window.open
// The width and height are placed into a window parameter string.
hist_window = window.open(url,
windowName,
'toolbar=no,location=no,scrollbars=yes,resizeable=no,width='+width+',height='+height);
}
</script>
<div class="footer2">
<a href="/" target="_top">Cleveland Clinic Home</a> |
<a href="/contact/">Contact s</a> |
<a href="popupdisclaimer.htm"
onclick="openNewWindow('http://www.clevelandclinic.org/home/popupdisclaimer.htm',
'Disclaimer',
500,
300);
return false;">Privacy Statement</a> |
<a href="popupprivacy.htm"
onclick="openNewWindow('http://www.clevelandclinic.org/home/popupprivacy.htm',
'Privacy',
500,
650);
return false;">Privacy Statement</a> |
© Cleveland Clinic 2006
</div>
This footer looks just like the previous one:
This footer behaves like the previous one, except that