Magnifying images with 'PopBox'

[Peter Hunt]

Hi All,

Recently, I discovered a interesting piece of javascript which offers
a nice way of magnifying pictures and other images :

http://www.c6software.com/Products/PopBox

I've made some minor changed (Verdana in stead of Arial, and an extra text box
at the bottom of the small picture) but some visitors tell me that the images
disappear after they have been clicked. Also, the bottom text box doesn't seem
to be aligned correctly in IE.

http://www.gsm-antennes.nl/kpn/index.html

The same page, but linked to the original script :

http://www.gsm-antennes.nl/kpn/index-org.html

Can anyone tell me what the problem is?

Regards,

Peter Hunt, Holland

 

[David Mark]

Hi All,

Recently, I discovered a interesting piece of javascript which offers

Famous last words.

a nice way of magnifying pictures and other images :

http://www.c6software.com/Products/PopBox

Not nice.

/
********************************************************************************************************************
* PopBox.js, v2.6b Copyright (c) 2008, C6 Software, Inc. (http://
www.c6software.com/)

[snip]

Look at the date.

* PopBox relies on many methods from Danny Goodman's (www.dannyg.com)
javascript library DHTMLAPI.js

A dead library.

* and his books, without which scores of web developers would be
totally lost. Thanks Danny.

Too bad he is still "totally lost." That's what happens when the
blind lead the blind.

********************************************************************************************************************/

// Seek nested NN4 layer from string name
function SeekLayer(doc, name) {
var theObj;
for (var i = 0; i < doc.layers.length; i++) {
if (doc.layers.name == name) {
theObj = doc.layers;
break;
}
// dive into nested layers if necessary
if (doc.layers.document.layers.length > 0) {
theObj = SeekLayer(document.layers.document, name);
}
}
return theObj;
}

// Convert object name string or object reference into a valid element
object reference
function GetRawObject(obj) {
var theObj;
if (typeof obj == "string") {
var isCSS = (document.body && document.body.style) ? true : false;
if (isCSS && document.getElementById) {
theObj = document.getElementById(obj);
} else if (isCSS && document.all) {
theObj = document.all(obj);
} else if (document.layers) {
theObj = SeekLayer(document, obj);
}
} else {
// pass through object reference
theObj = obj;
}
return theObj;
}

What a load of BS. Are further comments even necessary?

 

[SAM]

Le 11/26/08 11:57 PM, David Mark a écrit :

* PopBox.js, v2.6b Copyright (c) 2008, C6 Software, Inc. (http://
www.c6software.com/) (...)
Too bad he is still "totally lost."

********************************************************************************************************************/

// Seek nested NN4 layer from string name (...)
// Convert object name string or object reference into a valid element
object reference
function GetRawObject(obj) {
var theObj; (...)
} else if (document.layers) {
theObj = SeekLayer(document, obj);
}
return theObj;
}

What a load of BS. Are further comments even necessary?

Yes please.

I don't understand :
- what is 'BS'
- why not to see if NN4 ?

 

[David Mark]

Le 11/26/08 11:57 PM, David Mark a écrit :





Yes please.

I don't understand :
- what is 'BS'
Bullshit.

- why not to see if NN4 ?

Because it is a waste of time in 2008 for one. For two, the
inferences made are ridiculous. Read them again.

 

[Peter Hunt]

Hi David,

Thanks for your reply. I guess it really took you a while to sort it all out?
The world would be a much better place if there would have been more
people like you. It's really nice that you agree that this is one of best
scripts ever written. Since you've tested it in all possible browsers and
didn't find any malfunctions, I'll just leave it like this!

Best regards,

Peter Hunt.

 

[rf]

Hi David,

Thanks for your reply. I guess it really took you a while to sort it all
out?
The world would be a much better place if there would have been more
people like you. It's really nice that you agree that this is one of best
scripts ever written. Since you've tested it in all possible browsers and
didn't find any malfunctions, I'll just leave it like this!

This method is bad for two reasons.

1)
The group of reasons David pointed out.

2)
It is not presenting thumbnails. It is downloading the entire image and
resizing it as a thumbnail in the browser. Imagine a page with fifty or so
thumbnails on it. Real thumbnails (at 3K or so per each) would represent
150K of download. Large but not unmanagable. This method would result (given
the size of the first "example") in a page size of six thousand one hundred
K. Yep. over 6MB. Way over the top. BTW that example page is 3MB. And that
graduation image, two megabytes of image download that may not even be
expanded.

It's a nice idea but the real way to do this is to actually present
thumbnails to the browser. Real thumbnails. On click the script should hit
the host for the real image and expand that. That way the user only
downloads the large images if she wishes to view them.

 

[David Mark]

Hi David,

Thanks for your reply. I guess it really took you a while to sort it all out?

What does that mean?

The world would be a much better place if there would have been more
people like you.

[snip]

I'll just leave it at that.

 

[Peter Hunt]

It is not presenting thumbnails. It is downloading the entire image and

resizing it as a thumbnail in the browser.

No it is absolutely not :

<img id="kpn-1"
alt="kpn1.jpg"
src="kpn1.jpg"
pbsrc="kpn01.jpg"
pbShowPopBar="true"
pbCaptionPop="Noordwijk"
pbCaption="De (lange) 900 MHz antennes van KPN"
class="PopBoxImageSmall"
title="Klik om te vergroten/verkleinen"
onclick="Pop(this,100,'PopBoxImageLarge');" />

In which "kpn1.jpg" is the thumbnail :

http://www.gsm-antennes.nl/kpn/kpn1.jpg

And "kpn01.jpg" is the large version :

http://www.gsm-antennes.nl/kpn/kpn01.jpg

If there is one thing I hate on the WWW, it is the scaling of images.
Maybe the script isn't perfect, I didn't post it without a reason, but
it actually displays the thumbnails and caches the large versions so
they can be displayed quicker when a thumbnail is being clicked.

Bye, Peter.

 

[Peter Hunt]

Thanks for your reply. I guess it really took you a while to sort it all out?

What does that mean?

It means : "If you think you are funny, YOU ARE NOT".

Anyway, thanks for replying. I seems to be a lot of fun replying without
really helping someone.....

Peter.

 

[David Mark]

It means : "If you think you are funny, YOU ARE NOT".

Who is trying to be funny? You shouldn't be using that script.

Anyway, thanks for replying. I seems to be a lot of fun replying without
really helping someone.....

What is it about browser scripting that brings out the mental
defective in everyone? What more help did you expect? Dump the
script and find another one. That may not be welcome advice, but it
is good advice. And if you don't trust the advice of this group, why
ask questions here?

[snip]

 

[rf]

No it is absolutely not :

Yes, it absolutely is.

Look at the page you supplied the URL for. Scroll down to the first images,
of a castle. RIght click>properties (or whatever) on the left one. It is a
"thumbnail" that is 122.49KB in size.

Click the image to "expand" it. Check the properties again of that image.
122.49K. It's the same image.

<img id="kpn-1"
alt="kpn1.jpg"
src="kpn1.jpg"
pbsrc="kpn01.jpg"
pbShowPopBar="true"
pbCaptionPop="Noordwijk"
pbCaption="De (lange) 900 MHz antennes van KPN"
class="PopBoxImageSmall"
title="Klik om te vergroten/verkleinen"
onclick="Pop(this,100,'PopBoxImageLarge');" />

In which "kpn1.jpg" is the thumbnail :

Ah so there is an "option" for different images or something. Not good
enough. This thing should *enforce* different images. The way it is it
encourages download of images and resizing them in the browser.

If there is one thing I hate on the WWW, it is the scaling of images.

So why advocate the use of something that encourages it?

Maybe the script isn't perfect, I didn't post it without a reason, but
it actually displays the thumbnails and caches the large versions so
they can be displayed quicker when a thumbnail is being clicked.

Ah, so even if I choose to use this option to use different images it still
downloads the large image, including that two megabyte image of a
graduation?

I pity any dialup users who stumble upon this. Or somebody viewing it on
their telephone.

 

[Peter Hunt]

Recently, I discovered a interesting piece of javascript which offers

a nice way of magnifying pictures and other images :

People, I've decided to leave the script the way it is, as there is absolutely
ZERO input form anyone, other than saying that the script isn't good enough.

Thanks for your time, all!

Peter.

 

[David Mark]

People, I've decided to leave the script the way it is, as there is absolutely
ZERO input form anyone, other than saying that the script isn't good enough.

So "not good enough" is good enough for you. Fine for you, just keep
it to yourself.

Thanks for your time, all!

Don't forget to remove the script from your server. Sorry it didn't
work out!

[snip]

 

[fistakus]

Hi All,

Recently, I discovered a interesting piece of javascript which offers
a nice way of magnifying pictures and other images :

http://www.c6software.com/Products/PopBox

I've made some minor changed (Verdana in stead of Arial, and an extra text box
at the bottom of the small picture) but some visitors tell me that the images
disappear after they have been clicked. Also, the bottom text box doesn't seem
to be aligned correctly in IE.

http://www.gsm-antennes.nl/kpn/index.html

The same page, but linked to the original script :

http://www.gsm-antennes.nl/kpn/index-org.html

Can anyone tell me what the problem is?

Regards,

Peter Hunt, Holland

Hello,

If u are still interested in solving that problem... it's a well known
problem with borders in IE. In IE border width is included in width of
element, so if you want the title to display properly you should
rewrite the code for divCapTrans var.

The solution is to wrap this div (without border) with another div
(without width and height but with border), so this:
var divCapTrans = document.createElement("div");
divCapTrans.id = "popBoxDivCapTrans" + z;
divCapTrans.style.width = width - 2 + "px";
divCapTrans.style.height = "20px";
divCapTrans.style.borderStyle = "solid";
divCapTrans.style.borderWidth = "1px";
divCapTrans.style.borderColor = "#999999";
divCapTrans.style.padding = "0px";
divCapTrans.style.margin = "0px";
divCapTrans.style.position = "absolute";
divCapTrans.style.left = left + "px";
divCapTrans.style.top = top - 1 + "px";
divCapTrans.style.backgroundColor = "#ffffdd";
divCapTrans.style.zIndex = z;
should be replaced with this:
var divCapTrans = document.createElement("div");
divCapTrans.style.width = (width - 2) + "px";
divCapTrans.style.height = "20px";
divCapTrans.style.margin = "0px";
divCapTrans.style.backgroundColor = "#ffffdd";

var pbCaptionBordered = document.createElement("div");

pbCaptionBordered.style.border = "solid 1px #999999";
pbCaptionBordered.style.zIndex = z;
pbCaptionBordered.style.position = "absolute";
pbCaptionBordered.style.left = left + "px";
pbCaptionBordered.style.top = top - 2 + "px";
pbCaptionBordered.style.padding = "0px";
pbCaptionBordered.id = "popBoxDivCapTrans" + z;

then you must add these elements in proper order so:
parentNode.appendChild(divCapTrans);
fnRemove.push(function(){divCapTrans.parentNode.removeChild
(divCapTrans);});
will be:
pbCaptionBordered.appendChild(divCapTrans);
parentNode.appendChild(pbCaptionBordered);
fnRemove.push(function(){pbCaptionBordered.parentNode.removeChild
(pbCaptionBordered);});

and change line which adds a caption:
AddCaptionText(divCapTrans, divCapText, pbCaption);
to this:
AddCaptionText(pbCaptionBordered, divCapText, pbCaption);

This clue does not solve the problem in 100% - in IE there is stil
some problem but I think that you should be able to tackle this alone.

Best regards,
Magda

 

[David Mark]

Hello,

If u are still interested in solving that problem... it's a well known
problem with borders in IE. In IE border width is included in width of

[snip]

You are confused and the script has been condemned anyway. Why
rearrange deck chairs on the Titanic?

 

[fistakus]

On Nov 26, 1:51 pm, "Peter Hunt" <[email protected]>
wrote:

If u are still interested in solving that problem... it's a well known
problem with borders in IE. In IE border width is included in width of

[snip]

You are confused and the script has been condemned anyway.  Why
rearrange deck chairs on the Titanic?

Hmmm, I thought that there was a question about aligning the title.

I didn't write about the code - because you all did (and I'm not an
expert - just learning). If it's so badly written maybe someone can
point to better ones, please? Or maybe the one who asked will rewrite
it? Regardless, it's still good to know that borders in IE behave not
as they should, standardwise.

best regards,
Magda

 

[David Mark]

On Nov 26, 1:51 pm, "Peter Hunt" <[email protected]>
wrote:
Hi All,
Recently, I discovered a interesting piece of javascript which offers
a nice way of magnifying pictures and other images :
http://www.c6software.com/Products/PopBox
I've made some minor changed (Verdana in stead of Arial, and an extra text box
at the bottom of the small picture) but some visitors tell me that the images
disappear after they have been clicked. Also, the bottom text box doesn't seem
to be aligned correctly in IE.
http://www.gsm-antennes.nl/kpn/index.html
The same page, but linked to the original script :
http://www.gsm-antennes.nl/kpn/index-org.html
Can anyone tell me what the problem is?
Regards,
Peter Hunt, Holland
Hello,
If u are still interested in solving that problem... it's a well known
problem with borders in IE. In IE border width is included in width of

[snip]

You are confused and the script has been condemned anyway.  Why
rearrange deck chairs on the Titanic?

Hmmm, I thought that there was a question about aligning the title.

The answer is to not bother. Throw it away.

I didn't write about the code - because you all did (and I'm not an
expert - just learning). If it's so badly written maybe someone can
point to better ones, please? Or maybe the one who asked will rewrite it?
Regardless, it's still good to know that borders in IE behave not
as they should, standardwise.

Except that that is an inaccurate statement.

[snip]

 

[Jacket]

Instead of using that broken script, use this script:

http://www.magictoolbox.com/magicmagnify/

It works in all browsers and does not rely on a JavaScript library or
framework.

While you are there, look at the other two scripts as well - Magic
Zoom and Magic Thumb.

 

[David Mark]

Instead of using that broken script, use this script:

http://www.magictoolbox.com/magicmagnify/

That is a Flash movie.

It works in all browsers and does not rely on a JavaScript library or
framework.

I very much doubt it works in "all browsers." And of course, it won't
work in any browser without Flash.

While you are there, look at the other two scripts as well - Magic
Zoom and Magic Thumb.

I don't like Spam!

 

[rf]

Instead of using that broken script,

What script. Were you perchance answering somebody?

use this script:

http://www.magictoolbox.com/magicmagnify/

Flash. No thanks. I prefer to serve my viewers real images.