Pages: 1 
I've been to some sites where you can click a link, and the appropriate information will pop-up in a smaller browser window, with an appropriate 'close window' link.
I got some shipping information for my site that I need linked to on every page, and thought that would be perfect... since I don't want people to physically leave the product page.
How do they do that?
Moderator
From: Deland, FL
Registered: 2005-10-25
Posts: 1308
I've been thanked 23 times.
Offline
Javascript to call a div...easies that I've found.
Made the DIV hidden, clicking the link then shows the div...clicking the "close window" button makes it hidden again...I dont have any code laying around that does it...Not unless you can adapt a JS &CSS NavMenu snippet to get what you need 
I suggest searching Google for something.
Javascript.
You can google window.open and that will take you to hundreds of examples.
Same with window.close.
Both of them are built in functions for Javascript.
Hmmm... nope. The stuff I've seen doesn't look like java script at all. In fact, if I could stay away from that, all the better. (godless creation from hippies)
I'm pretty sure what I seen was a static link to an html page, but the page opened up into a pre-determined sized window. Most of the time, with all your typical browser menu options and navigation gone.
Isn't there a way to Target="new_window" width="xxx"..... er, something like that, where you tell the link to open a new browser window, but with more tags to size the window itself?
Java...... *shudder*
Member
From: London, UK
Registered: 2006-11-27
Posts: 15
I've been thanked 0 times.
Offline
Hi MrStitch,
If you add the following to the <head> section of the pages displaying the shipping info link....
Code:
<script>
function openpopup(){
var popurl="shippinginfo.html"
winpops=window.open(popurl,"","width=600,height=600,scrollbars,popFrameless")
}</script>
(obviously change the page name to whatever you have called it!)
Then, where you want the link to appear on each page, add...
eg:
Code:
<a href="javascript:openpopup();">Shipping Information</a>
This will display the shipping page as a pop up window in the dimension shown in the <head> script.
To insert the close window link on the shipping page, add...
Code:
<a href="javascript:window.close()">Close Window</a>
to the bottom of the page.
If you decide to use other popups on the same page, all you need to do is change the link code to..
Code:
]<a href="javascript:openpopup1();">Other Information</a>[/
and then copy the <head> script but change the function to match the link. eg. openpopup1() then type in the new page name.
Hope this helps. 
Sorry that it's javascript, but it works!
Steve
Nevermind.....
Looking around the net, it looks like I'm getting the same answer.... using friggin' java scripts, which don't even seem to work all that well with IE or FF in the first place.
Meh... guess I tried.
Moderator
From: Yorkshire, UK
Registered: 2006-08-19
Posts: 2793
I've been thanked 77 times.
Offline
You can use a standard <a href='.....' target='new'>bla blah</a> or whatever to open a new window. But every time you see a window on the internet that has been given a specific size then it has been re-sized through javascript.
You can either set the size and position of the new window on the original page (as the examples above instruct) or you can use similar javascript in the new window initiated by a body onload event.
getting the new window to do the re-sizing means that you'll have a natural <a...> link on the page that won't get blocked by pop up blockers.
As for the close window - that's java script as well, and always will be. Sorry
Moderator
From: Deland, FL
Registered: 2005-10-25
Posts: 1308
I've been thanked 23 times.
Offline
What is the problem with using JS? Why cant you use it?
Cybermagic gave a really good example, one that I've seen before. The other option is as I said - use JS and CSS to hide/show a DIV.
Not too much to it, really...
The examples given were great... props to you folks that helped me.
Java script just leaves a sour taste in my mouth. It just never seems to work well. Crashing browsers, funny stuff happening, etc.
Almost like JS is a good idea in theory, but it's the bastard child of web development.
Member
From: Loughborough, United Kingdom
Registered: 2006-04-14
Posts: 796
I've been thanked 13 times.
Offline
javascript isn't the problem, badly coded javascript is however.
chromeless sized window code is pretty universal and shouldn't crash ie, ff or even safari.
NoSting Hosting - Brightside Hosting Ltd: Member of Nominet / eNom ETP
^^^ Now with over 400 free templates, ShoutCast, LAME + FFMPeg
Ringtones - Palace Marketing Ltd: D2C and B2B mobile content since 2002
Ok... what if we try to run this java script at a minimum....
Can I use a static link to the page, but the shipping page have all the JS code to re-size the window? This way the user doesn't reload unnecessary code on every product page, since the shipping information will be the same universally.
Member
From: London, UK
Registered: 2006-11-27
Posts: 15
I've been thanked 0 times.
Offline
You can either set the size and position of the new window on the original page (as the examples above instruct) or you can use similar javascript in the new window initiated by a body onload event.
Northie's is a better idea than mine. By using the body onload, the visitor will still be able to see the shipping page even if javascript is turned off in their browser. It will just display as a normal page.
Moderator
From: Deland, FL
Registered: 2005-10-25
Posts: 1308
I've been thanked 23 times.
Offline
Are your product pages php? If so, do you have a header that you PHP Include on each page? Say for instance:
Code: php
<?php include('header.php'); ?>
If so, all you have to do is add something like:
Code: html
<script language="javascript" type="text/javascript" src="popup.js">
So it is automatically included on ever page.
Then, create a file called "popup.js". Use something like this:
Code: javascript
function toggleVisibility(id, NNtype, IEtype, WC3type) {
if (document.getElementById) {
eval("document.getElementById(id).style.visibility = \"" + WC3type + "\"");
} else {
if (document.layers) {
document.layers[id].visibility = NNtype;
} else {
if (document.all) {
eval("document.all." + id + ".style.visibility = \"" + IEtype + "\"");
}
}
}
}
function openMenu(expand_menu) {
toggleVisibility('popwindow','hidden','hidden','hidden');
toggleVisibility(expand_menu,'show','visible','visible');
}
function closeMenu() {
toggleVisibility('popwindow','hidden','hidden','hidden');
}
Then, create a DIV Style in your CSS.
Then, your popup window HTML code:
Code: html
<a href="#" onClick="openMenu()">Shipping Information</a>
I think that is correct...I might have missed something...sorry if I did.
Got the code that I need to load into the body of the shipping page then?
Product pages are not php... everything is straight-up html
Moderator
From: Yorkshire, UK
Registered: 2006-08-19
Posts: 2793
I've been thanked 77 times.
Offline
Don't worry about Mark's post!
php isn't necessary - it will just help with templating.
Mark's idea is slightly different tot he rest of ours - it has the shipping info already on the page, but in a hidden <div> element, that gets un-hidden by clicking a link and using javascript to change the styles and positioning
A very viable alternative to a 'new' window
Moderator
From: Deland, FL
Registered: 2005-10-25
Posts: 1308
I've been thanked 23 times.
Offline
Ok ok...so I was thinking outside of the box 
At least it works...
Not out to confuse anyone...Sorry if I did.
Northie is correct, the content would still be on the page, it would just be hidden until you clicked a link to make it visible.
No more PHP/JS/CSS/HTML code confusion from me...Carry on Northie and CyberMagic!
Moderator
From: Yorkshire, UK
Registered: 2006-08-19
Posts: 2793
I've been thanked 77 times.
Offline
MarkCCDC wrote:
Ok ok...so I was thinking outside of the box
At least it works...
Not out to confuse anyone...Sorry if I did.
Northie is correct, the content would still be on the page, it would just be hidden until you clicked a link to make it visible.
No more PHP/JS/CSS/HTML code confusion from me...Carry on Northie and CyberMagic!
Didn't mean to put your nose out of joint, I just thoght whooaaa! WTF, then read a bit further and thought "mmm, clever" so decided to draw attention to it again, incase anyone was put off but the php stuff
Moderator
From: Deland, FL
Registered: 2005-10-25
Posts: 1308
I've been thanked 23 times.
Offline
I just finished a project that relies 100% on PHP....The way I have it set up is like this:
PHP Looks at URL.
Sets a Session based on the URL (5 different URL's will be 301'ed to this site)
Variables in the session include: Product ID, Product Name, Address, Phone Number, and Fax Number.
Header code is chosen based on Product ID.
Sidebar code is chosen based on Product ID.
Logo is chosen based on Product ID.
Navmenu is chosen based on Product ID.
The JS code I pasted was what I used for the Navmenu.
I had to INCLUDE files everywhere...
Guess I'm still in that mindset 
Sooo...
Does anyone know the code that I can place inside the shipping information page, that will resize the window, etc. (instead of the java code on every product page to open a window)?
| Never |
You are not logged in.
