Open a Window
For the Engineers Association website, people submit newsletters to me as Word or PDF documents and ask me to post them to the website. I thought it would be good to have those open in a separate window since they are not html documents. I searched for the tag that would do that, but quickly found that it requires javascript. Also I found a site that said opening new windows was one of the top ten bad things that web designers can do because if the user wants to open a new window they can do it themselves and opening a new window messes up the Back button since you can't go back from a new window (you have to close the window).
The function I needed was window.open. I found a function that would do it and then you would call the function (in fact I used that when I made the covered bridge navigator), but I wanted it to all be in the link without a separate function call. By searching for "window.open" and "href" I found the exact same guy's web page, written 4 years after his original warning to avoid opening a window, saying that for non-web documents it was best to open a new window because when people open a .pdf document they usually close the window to get rid of it and then lose their place and have to start the browser from scratch again (which is exactly what I always do). However he did not provide any code on how to do this. I soon found a really good way to do it by using the HREF to go to the .pdf file, but adding an onClick that would cause a new window to open. Then you have the best of both worlds: when someone mouses over the link they see where they are going, they can even download the file by right-clicking it, and the link still works even if they've turned javascript off. But if they have javascript running, it will open a new window when they click it.
The code below opens a new resizable window 700 pixels wide (enough for letter size width) by 500 pixels vertical, without toolbars:
<a href="newsatl06.pdf" onClick="window.open('newsatl06.pdf','mywin','left=20,top=20,width=700,height=500,toolbar=0,resizable=1'); return false">February 2006 Newsletter</a>
You can also see it in action
| Permalink
| 
Comments (3)
Well, I'll be derned!
Posted by Mom | March 16, 2006 3:21 PM
This method was under your nose... or under your blog. When posting photos on MovableType, you have the option to create a thumbnail that will pop-up into a window. It is a cleaner way to zoom into a photo. I used it here. Link.
Posted by Jeb | March 16, 2006 8:13 PM
I thought it would do that so I went to my blog and clicked on Katie's x-ray picture, but it didn't open a new window. That was because I didn't pick the option to open it in a new window, but I couldn't think of any entries where I had done that so I just had to find it myself elsewhere.
Posted by UT | March 16, 2006 10:11 PM