PDA

View Full Version : Minimize/Close in Full-Screen Window (best method???)


Gordo
08-04-2002, 09:42 AM
Just need to make sure this method is "ok". Other (better) methods will certainly be tested, buy YOU have to provide them. Please give full-code, working examples in your replies (thanks).

Oh, and my page will be IE ONLY. Other browser users will be redirected elsewhere.

I will have a child page that is launched full-screen -- even though many of you hate it. When done correctly, it's not too too bad. And I'm trying to do it "right".

So, I plan on having MINIMIZE and CLOSE buttons in the upper right corner. My goal is to not strand the user on my page. But, I don't want them to have to close my child window in order to use other programs. I'm going with the assumption that my user is NOT familiar with ALT+F4 and/or CTRL+W. I want them to feel comfortable "minimizing" the window in order to see their taskbar once again...and click on other browser windows, programs running, etc.

So far, I have the following. Is this the best way to do this? I'll eventually switch to images. I'm concerned more with the functionality.

<input type="button" onclick="window.blur()" value="Minimize" name="MINIMIZE">
<br>
<input type="button" onclick="window.close()" value="Close" name="CLOSE">

SYP}{ER
08-04-2002, 12:11 PM
I don't think there are any better ways (Though I heard there was an activeX thing that didn't prompt the user when closing the window or something...)

Also, since it's IE only, why not use the <button> tag?

It supports images inside the button, so you can do this:

<button style="padding: 3px; color: #333333"><img src="icon.gif" border="0" alt="Close" /></button>

:)

Works IE4+

Mhtml
08-04-2002, 12:20 PM
<button onClick="window.blur()">_</button>
<button onClick="window.close()">X</button>

edit: Well @ least someone else had the same idea. I never knew that you could put images on it though, very interesting.

Gordo
08-04-2002, 10:50 PM
Excellent!

I've taken these a little further with CSS. Since the images I'd use would be GIFs with transparent portions, the following CSS works great:

input, textarea, select {
border-style: none;
font-family: Verdana, Arial;
font-size: 10px;
color: #B65C51;
background-color: #FEF191
}
button {
border-style: none;
font-family: Verdana, Arial;
font-size: 10px;
color: #B65C51;
background-color: transparent
}

Various examples in HTML source code:
<p>
<input type="button" onclick="window.blur()" value="Minimize" name="MINIMIZE">
<input type="button" onclick="window.close()" value="Close" name="CLOSE">
</p>

<p>
<input type="button" onclick="window.close()" value="X" name="CLOSE">
</p>

<p>
<button><img src="images/close.gif" width="10" height="10" border="0" alt="Close"></button>
</p>

<p>
<button onClick="window.blur()">_</button>
<button onClick="window.close()">X</button>
</p>

<p>
<img border="0" src="images/close.gif" width="10" height="10" onClick="window.close()">
<img border="0" src="images/minimize.gif" width="10" height="10" onClick="window.blur()">
</p>

To me, the last example seems easiest. PLEASE correct me if I'm wrong.

SYP}{ER
08-05-2002, 02:18 AM
They're all easy now since you've already typed them out :P

I prefer <button> because it gives it a more realistic effect :)

Zvona
08-05-2002, 09:53 AM
Closing browser window without prompting :

http://www24.brinkster.com/zvona/htmlexa.asp?article=04

boxer_1
08-05-2002, 02:41 PM
For more on the button element: http://javascriptkit.com/howto/button.shtml

esntric
08-05-2002, 08:17 PM
I dont know if you already know this or not, or if it will change when it is applied to a full screen window, but the button at http://www24.brinkster.com/zvona/htmlexa.asp?article=04 will not work on the AOL browser ( atleast on 7.0 ) as is. What the button does is close out AOL completely. But, it works great on IE.

Just an observation. Perhaps it will be different if the page is full screen and not normal?

Gordo
08-05-2002, 10:23 PM
I've been trying to view various pages on Brinkster for over a week with no luck! I can't get to a single one!!! &%(#@! Is that article too large to cut-n-paste?

boxer_1 -- I've seen that page before, but there was no way I'd remember where. Thanks for the link -- maybe I'll add it to my already-overloaded Favorites.

As for AOL, my particular example/site won't be veiwable by AOL users anyway. If the viewer isn't using IE, then they'll be redirected. Come to think of it, I can't remember which engine runs AOL browsers -- but I don't really care. I'm anti-AOL. It's not a good thing to be negative but I'm just not losing any sleep over this one...not this time around. Anyway, since code is code, I would imagine that it would still close all of AOL...full-screen mode shouldn't change anything.

Zvona
08-05-2002, 10:38 PM
Originally posted by esntric
I dont know if you already know this or not, or if it will change when it is applied to a full screen window, but the button at http://www24.brinkster.com/zvona/htmlexa.asp?article=04 will not work on the AOL browser ( atleast on 7.0 ) as is. What the button does is close out AOL completely. But, it works great on IE.

Just an observation. Perhaps it will be different if the page is full screen and not normal?

Note: my site which contains these few examples (which are frequently asked, btw), is designed very poorly. It works only on IE5+, NS6+/Moz0.9+ and Opera6+. However, that's not a complete site (like the text offline should indicate).

Also straight linking to Brinkster seem to function only occasionally. I'm spending time on writing cross-browser site with more clear articles.

Still, most of the articles has provided help, thus I usually refer to them.

zoobie
08-06-2002, 01:58 AM
Very nice Zvona...heh heh ;)