PDA

View Full Version : help with popup windows


Sharron
06-22-2005, 06:57 AM
http://www.speedymacfab.com/test/products/demo-products-pw.html

I can't use php, even if I can figure it out, the server does not offer it at this time. This is as much as I can get to work, and it does not work like I thought it should. Didn't know I would have to make individual pages for the popups. But I can handle it, I would like to know how to get a close popup on the pop up, how to get it close maybe by itself? And how to edit what it says at the top of the pop page, instead of saying the page name could it say the product mumber or product group, ie: toolboxes, ramps and so on.

I have been working on this one small thing for hours and hours.


also it is showing me 12 errors on the page and everyone is a form lack of "action" attribute. all 12 are the zoom buttons. I would love to know how to fix that, is it simply some text I can add somewhere? I don't want errors. :cry:

webado
06-22-2005, 07:16 AM
On each of the pages that get open by pop-up make sure to put a title in the head section. Right now you have nothing there.


Take as an example this page (the first pop-up I think, I forgot the name):

You modify the page by adding a script in the head section, an onLoad event handler to the body and somethign to click for people who want to close it ebfoe the time runs out.

So it will be like this:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>This widget here</title>

<script language="javascript" type="text/javascript">
// (C) 2001 www.CodeLifter.com
// http://www.codelifter.com
// Free for all users, but leave in this header

var howLong = 10000;

t = null;
function closeMe(){
t = setTimeout("self.close()",howLong);
}

</script>

</head>

<body onload="closeMe();self.focus()">
<center>../toolboxeimages/124_b_small.jpg


Speedymacfab Tool Boxes

Tool Box #smf-124_b



../../div-images/want-it.gif</p>

Close window (javascript:self.close())
</center>
</body>
</html>


Note the variable howLong in the script which is set to 10000 - that in milliseconds - so it's 10 seconds. You can set that to different values.

webado
06-22-2005, 07:23 AM
Instead of using a pseudo-form for the zoom button, why don't you make a graphic zoombutton.jpg in its place and rewrite this:

<form><input type="button" value="Zoom" onclick="javascript:popUp('tb-product-zooms/prod124_blarge.html')"></form>


as this:

zoombutton.jpg (tb-product-zooms/prod124_blarge.html)


remember to fix the width and height for the image, as I'm only guessing at it.

webado
06-22-2005, 07:31 AM
One more thing: php cannot do pop-up windows anyway. You would still have to use javascript for the pop-up effect.

What php allows is to write a general script which takes file names as query strings to do somehting with. That somethign can be to open a pop-up window or an ordinary window as a new window (target="_blank").

It has just come to my attention that the almighty ultra-picky w3c might frown upon the use of target="_blank" for opening links... and in fact the javascript pop-up window is recommended - which so many paranoid people disable LOL!

I swear, this whole thing is designed to take all the fun out of webbing :lol:

Sharron
06-22-2005, 02:09 PM
Thanks! This is great.


Quick question! I am almost done making all your suggestion changes, Chris. However I do not like the border around my new zoom graphic, how do I get that off there?

ps, Now I am thinking I should include in the style sheet, but that would mean I had to make one for each popup window wouldn't it! Can I do that and make it a clickable link, in a style sheet? No I don't think so, as each time it would have a different hyperlink. ? I wonder.............

Sharron
06-22-2005, 03:15 PM
oh Good gosh, I have messed something up! It now pops open, but a full new page, and when I close it it shuts down the site not just the page.

what have I done?



I THINK I HAVE IT FIXED! YEAH WILL UPLOAD WHEN I AM FINISHED!

webado
06-22-2005, 04:20 PM
Oh, sorry, the border around the image that you click, I should have put border="0" inside the <img ... > tag . Sorry about that.

But you've already figured that out anyway :lol:

Sharron
06-22-2005, 04:32 PM
HORAY FOR CHRISTINA!

It works, gosh that was difficult. Chris don't ask me how I removed the border, cause I certainly did not know I was removing a border. I was just cutting and pasting stuff trying to get the zoom image to open in the small pop up window like the form button did.

I think I moved stuff around and tried various things, finally it worked when I deleted the form tags, and used the image thingy.

I managed to get it error and warning free also!

Thank you

Now if I can get the http:// address off the top of the pop up page and get the page title to show there instead. Can I do that?

jonra01
06-22-2005, 04:33 PM
Now I am thinking I should include in the style sheet, but that would mean I had to make one for each popup window wouldn't it! Can I do that and make it a clickable link, in a style sheet? No I don't think so, as each time it would have a different hyperlink. ? I wonder.............
You could make a stylesheet for the zoom pages and include it on every page. Just create your styles like you normally would and then save them to a .css file that is linked to in the head section. Call it something like zoompages.css

body {
font-family: arial, verdana, sans-serif;
font-size: 0.9em;
color: #000000;
}

Create as many styles as you need for these pages and then link it like this in the <head> section right after the title.
<link href="zoompages.css" rel="stylesheet" type="text/css">

All of the zoom pages would use the same stylesheet.

John

webado
06-22-2005, 05:03 PM
Sharron, the top of any window displays the text in the <title> ..</title> tag. If no text is given it displays the URL.

Remember I had this in the first reply to your post, as you'd left it blank before.

<title>This widget here</title>

JWJ
06-22-2005, 05:15 PM
Sharron, I couldn't find a way of stopping "Microsoft Internet Explorer" appending itself to the title so I use titles like <title>This widget here_____________</title> to force Microsoft off the screen. It may not be necessary in your case since you're using much narrower windows anyway. :wink:

Sharron
06-22-2005, 10:11 PM
Jonra, made a style sheet, but used topstyle's wizard to do it. Take a look and tell me how it looks. Also Jonra I optimized the background images and concerted them to gif's. Does that make my page load any faster?

Christina I included title's first thing this morning. They have been there the entire time since then and are still there now! But it still displays the http:// address at least in FireFox.

JwJ I don't think I want to stop it from appending to the title, I want the title to show as ulitmately they will be named the correct product numbers and Id's. Of course I am not 100% sure of the correct difinition of appending! lol :oops:

Moments later: The title is showing in the pop up in IE, but not FF. Have not checked other browsers yet. And In IE it is running my stuff off the bottom of the page.


More Moments later Ok I have the spacing issue figured out, had to take out the

and </p> tags and insert


It shows the page title in the pop ups in all (IE, Netscape, Opera) but Firefox. In Opera when you click on the zoom image it does some weird thing like it is trying to open twice, glitch, then it opens one window. Opera is also showing smaller text, but I can live with that. In Enigma the pop up is opening as a whole page.

webado
06-22-2005, 11:26 PM
Did you clear the cache in FF? You may still be seeing old versions of your pages.

Opera is often flaky, as for Enigma... well, I've never even heard of this browser :lol:

jonra01
06-22-2005, 11:30 PM
Jonra, made a style sheet, but used topstyle's wizard to do it. Take a look and tell me how it looks. Also Jonra I optimized the background images and concerted them to gif's. Does that make my page load any faster?
Looks good. Not real sure about the way topstyle wrote the font name. I'd change that to - Arial That version of arial might not be the one some people have on their system.

But it still displays the http:// address at least in FireFox.
This is actually a security feature in firefox. I doubt you can do anything about it. - "Display hostname in title bar when address bar is hidden, to reduce the impact of the fact that web sites are allowed to spoof address bars."

John

JWJ
06-23-2005, 07:40 AM
JwJ I don't think I want to stop it from appending to the title, I want the title to show as ulitmately they will be named the correct product numbers and Id's. Of course I am not 100% sure of the correct difinition of appending! lol :oops:
All I meant by this was that if you use something like <title>Speedy Toolbox #1234</title> then what would be displayed in the title bar would be "Speedy Toolbox #1234 - Microsoft Internet Explorer". I use a string of underscores to push Microsoft over to the right. I can see now that in your case it is not necessary so forget I mentioned it. :wink: