Popup window problem

E

EnjoyNews

I have a popup problem.

I have a script that generates a popup for image viewing.

It has 2 function, and the first is that it automaticly generates the popup
window to the size of the image, and the second is that it closes the popup
window when you click outside of it.

It is a script I have found on the internet, since I have no experience in
javascript coding.
It works fine, but the site won't go through a w3c validation.

In the script there are some body, title, head tag's which the validation
won't exept.
It looks like it can't see that it is inside a script, and think it's a body
tag that is suddently in the middle of the site, which it ofcause won't
exept.


So I need a little help with this one.
Or maybe if it's an older script, and someone knows a better and newer one
that can do the job.


Here is the script:

<script type="text/javascript">

PositionX = (screen.width/20);
PositionY = (screen.height/20);
defaultWidth = 800;
defaultHeight = 800;
var AutoClose = true;
if (parseInt(navigator.appVersion.charAt(0))>=4){
var isNN=(navigator.appName=="Netscape")?1:0;
var isIE=(navigator.appName.indexOf("Microsoft")!=-1)?1:0;}
var
optNN='scrollbars=no,width='+defaultWidth+',height='+defaultHeight+',left='+
PositionX+',top='+PositionY;
var
optIE='scrollbars=no,width=150,height=100,left='+PositionX+',top='+PositionY
;
function popImage(imageURL,imageTitle){
if (isNN){imgWin=window.open('about:blank','',optNN);}
if (isIE){imgWin=window.open('about:blank','',optIE);}
with (imgWin.document){
writeln('<html><head><title>Loading...</title><style>body{margin:0px;}</styl
e>');writeln('<sc'+'ript>');
writeln('var isNN,isIE;');writeln('if
(parseInt(navigator.appVersion.charAt(0))>=4){');
writeln('isNN=(navigator.appName=="Netscape")?1:0;');writeln('isIE=(navigato
r.appName.indexOf("Microsoft")!=-1)?1:0;}');
writeln('function reSizeToImage(){');writeln('if
(isIE){');writeln('window.resizeTo(100,100);');
writeln('width=100-(document.body.clientWidth-document.images[0].width);');
writeln('height=100-(document.body.clientHeight-document.images[0].height);'
);
writeln('window.resizeTo(width,height);}');writeln('if (isNN){');
writeln('window.innerWidth=document.images["George"].width;');writeln('windo
w.innerHeight=document.images["George"].height;}}');
writeln('function
doTitle(){document.title="'+imageTitle+'";}');writeln('</sc'+'ript>');
if (!AutoClose) writeln('</head><body bgcolor=000000 scroll="no"
onload="reSizeToImage();doTitle();self.focus()">')
else writeln('</head><body bgcolor=000000 scroll="no"
onload="reSizeToImage();doTitle();self.focus()" onblur="self.close()">');
writeln('<img name="George" src='+imageURL+'
style="display:block"></body></html>');
close();}}

</script>

And on the site i write this:

<a href="javascript:popImage('the image url','the popup window name')">click
here</a>
 
R

RobG

EnjoyNews said on 19/04/2006 5:48 AM AEST:
I have a popup problem.

I have a script that generates a popup for image viewing.

It has 2 function, and the first is that it automaticly generates the popup
window to the size of the image, and the second is that it closes the popup
window when you click outside of it.

It is a script I have found on the internet, since I have no experience in
javascript coding.
It works fine,
Click to expand...

No, it doesn't, you just haven't found where it fails. Try it in a
browser whose navigator.appName string doesn't contain either "Netscape"
or "Microsoft" or has a version number less than 4 (there are lots of
those).

but the site won't go through a w3c validation.

In the script there are some body, title, head tag's which the validation
won't exept.
It looks like it can't see that it is inside a script, and think it's a body
tag that is suddently in the middle of the site, which it ofcause won't
exept.
Click to expand...

"Accept". Put the script in an external file, then the validator won't
see it.

So I need a little help with this one.
Or maybe if it's an older script, and someone knows a better and newer one
that can do the job.
Click to expand...

Search the archives for pop-up scripts, there are many that are better
than the one below. Read the stuff here:

Here is the script:

<script type="text/javascript">

PositionX = (screen.width/20);
PositionY = (screen.height/20);
Click to expand...

Variables should always be declared with 'var'. There is no need to
make these global variables, keep them local to the function.

It is a convention that variables starting with capital letters can be
used as constructors, so make the first letter lower case.

Don't presume to know where the user wants the popup (if they allow it
at all). Just let it go where it wants - remember you are dealing with
screens that are generally anywhere from 800 to 1600 pixels wide (and
some are very much wider than that - e.g. one desktop across two screens
of 1600px each). Let the user put the pop-up whee they want, then
re-use it.

The property you are probably looking for is:

var positionX = self.screen.availWidth/20;

which will allow for screen features that take up space (e.g. Mac menu
bar & doc, Windows start bar).

defaultWidth = 800;
defaultHeight = 800;
var AutoClose = true;
if (parseInt(navigator.appVersion.charAt(0))>=4){
var isNN=(navigator.appName=="Netscape")?1:0;
var isIE=(navigator.appName.indexOf("Microsoft")!=-1)?1:0;}
Click to expand...

Browser sniffing is bad, just don't do it. This will exclude some
browsers for no good reason as noted above.

var
optNN='scrollbars=no,width='+defaultWidth+',height='+defaultHeight+',left='+
PositionX+',top='+PositionY;
var
optIE='scrollbars=no,width=150,height=100,left='+PositionX+',top='+PositionY
;
Click to expand...

I'm curious why browsers that you think are 'Netscape' get a window 8
times higher and nearly 6 times wider than what you give to those you
think are IE (noting that the UA string may have no bearing at all on
which browser is actually being used).

Replace the script with something from the references above.

[...]
And on the site i write this:

<a href="javascript:popImage('the image url','the popup window name')">click
here</a>
Click to expand...

And if scripting is disabled, the user sees nothing. Use:

<a href="image.jpg"
onclick="return popImage(this.href,'the popup window name')">Click
here to open image in a popup</a>


Have popImage() return false if the popup is successfully opened,
otherwise return true and the link will be followed. It is much more
efficient to have the server generate HTML for the popup; have the
client supply just the URL, not all the HTML as well.
 
S

Scott

Instead of trying to determine the size of the image client side, do it
server side. Since you're not familiar with JavaScript, maybe this VB
code will point you in the right direction:

http://www.effengud.com/articles/imgsz.html

I did not write it, but with this script slightly modified, you can set
the size of the window as the images are dynamically called. I have
used this code on my own sites and it works fantastic. Also, doing it
server side eliminates your issue of it being W3C compliant as the
window will already be correctly sized before displaying the picture.
Adding the functionality to close the window onblur should not be an
issue after that.

If you want to see it in action, send me an email and I will provide
you with a link to a sample that should give you a better idea of how I
actually utilized it.

Scott
 
E

EnjoyNews

EnjoyNews said:
I have a popup problem.

I have a script that generates a popup for image viewing.

It has 2 function, and the first is that it automaticly generates the popup
window to the size of the image, and the second is that it closes the popup
window when you click outside of it.

It is a script I have found on the internet, since I have no experience in
javascript coding.
It works fine, but the site won't go through a w3c validation.

In the script there are some body, title, head tag's which the validation
won't exept.
It looks like it can't see that it is inside a script, and think it's a body
tag that is suddently in the middle of the site, which it ofcause won't
exept.


So I need a little help with this one.
Or maybe if it's an older script, and someone knows a better and newer one
that can do the job.
Click to expand...

Hi again

I have now read your answers and I have have read about javascript on the
pages your link to.
I'm a not used to javascript at all, so right now I am a little confused
:eek:)))

I can see now that the script I have on my site is not very good, so I need
to have a brand new one.
But it is just to difficult for me I must admit. I'm not very good at
scripting.. :eek:((

So therefore I will ask if someone could please help me by write some
javascript lines for me... I have very few things I want it to do, so I
don't think it is to difficult for someone who is good at it.

It is a image popup.
A link with <a href="image.jpg" onclick="something">Click here</a>

I won't it to put up in a new window without scrolling and statusbar. It
must be resizeable=no
The tricky part is that the window must be the same size as the image, and I
want it to close automaticly when you click outside the window.
This is what I can't figure out. ?

The posotion is not important, but if it could be place in the middle of the
screen it would be nice, but it isn't important.


If someone could help me with this I would really really apreciate it.


thanks in advance

Michael
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

JEDs popup problem.... 0
yet another Safari question... auto-sizing popup window not working 0
javascript: window.open ie6 vs ie7 2
window.open window.resizeto ie 7 0
Help! Animation stops! 4
Problem with resizable popup 4
Popup HTML help 5
Add scrollbar to popup window 0

Members online

Total: 53 (members: 2, guests: 51)
Robots: 486

Forum statistics

Threads
473,994
Messages
2,570,222
Members
46,810
Latest member
Kassie0918

Latest Threads

Top