Zoom script

Santander · Dec 18, 2008

I want this 'Click to zoom' javascript, but not sure how to separate it
components from the html code and css.

http://www.demo.storetemplates.co.uk/osc_qtpro/product_info.php?products_id=1

Could someone help please?

Jonas Raoni Soares Silva · Dec 19, 2008

I want this 'Click to zoom' javascript, but not sure how to separate it
components from the html code and css.

http://www.demo.storetemplates.co.uk/osc_qtpro/product_info.php?produ...

Could someone help please?

Using Firebug you can watch what CSS properties are applied to the
elements, separate the JavaScript files and check what you really need
from them (it's not that difficult).

If you're having much trouble with this, try asking a freelancer to
make it for you or start the code from zero (it's easy)

David Mark · Dec 19, 2008

I want this 'Click to zoom' javascript, but not sure how to separate it
components from the html code and css.

http://www.demo.storetemplates.co.uk/osc_qtpro/product_info.php?produ...

Could someone help please?

With what? It is called "Highslide" (quite appropriate as it turns
out) and is located at:

http://highslide.com/download.php

But this should give you pause:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "xhtml11.dtd">

As should this:

ie : (document.all && !window.opera),
safari : /Safari/.test(navigator.userAgent),
geckoMac : /Macintosh.+rv:1\.[0-8].+Gecko/.test(navigator.userAgent),

$ : function (id) {
return document.getElementById(id);
},

It gets worse:

setAttribs : function (el, attribs) {
for (var x in attribs) el[x] = attribs[x];
},

setStyles : function (el, styles) {
for (var x in styles) {
if (hs.ie && x == 'opacity') {

if (styles[x] > 0.99) el.style.removeAttribute('filter');
else el.style.filter = 'alpha(opacity='+ (styles[x] * 100) +')';
}
else el.style[x] = styles[x];
}
},

This is your brain on drugs. And there's another 50K of it. Just say
no.

Santander · Dec 19, 2008

Thanks for tips. I'm not sure I understand note about the html code: is
there something wrong in this script?

Thanks.
------------

I want this 'Click to zoom' javascript, but not sure how to separate it
components from the html code and css.

http://www.demo.storetemplates.co.uk/osc_qtpro/product_info.php?produ...

Could someone help please?

With what? It is called "Highslide" (quite appropriate as it turns
out) and is located at:

http://highslide.com/download.php

But this should give you pause:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "xhtml11.dtd">

As should this:

ie : (document.all && !window.opera),
safari : /Safari/.test(navigator.userAgent),
geckoMac : /Macintosh.+rv:1\.[0-8].+Gecko/.test(navigator.userAgent),

$ : function (id) {
return document.getElementById(id);
},

It gets worse:

setAttribs : function (el, attribs) {
for (var x in attribs) el[x] = attribs[x];
},

setStyles : function (el, styles) {
for (var x in styles) {
if (hs.ie && x == 'opacity') {

if (styles[x] > 0.99) el.style.removeAttribute('filter');
else el.style.filter = 'alpha(opacity='+ (styles[x] * 100) +')';
}
else el.style[x] = styles[x];
}
},

This is your brain on drugs. And there's another 50K of it. Just say
no.

David Mark · Dec 19, 2008

Thanks for tips. I'm not sure I understand note about the html code: is
there something wrong in this script?

There's a lot wrong. Don't use it.

[snip]

Santander · Dec 19, 2008

Opps! Is there some image zoom script that visually works the same way and
completely compatible with osCommerce?

Thanks.

Thanks for tips. I'm not sure I understand note about the html code: is
there something wrong in this script?

There's a lot wrong. Don't use it.

[snip]

David Mark · Dec 19, 2008

Opps! Is there some image zoom script that visually works the same way and
completely compatible with osCommerce?

What is osCommerce? Regardless, any script that competently adjusts
the dimensions of images should suffice.

[snip]

Jonas Raoni Soares Silva · Dec 19, 2008

What is osCommerce?

It's an open source e-commerce.

Regardless, any script that competently adjusts
the dimensions of images should suffice.

After some years working, I can say, give the client what he wants,
just be sure to notify him about the problems and how idiot is such
animations.

If you have knowledge enough, make the code by yourself, frameworks
are a bunch of crap.

Santander · Dec 19, 2008

well, there is a plenty of community contributions/ add-ons for osCommerce,
perhaps someone have more experience and can recommend better image image
pop-up/zoom to replace the default one.

S.
---------

What is osCommerce?

It's an open source e-commerce.

Regardless, any script that competently adjusts
the dimensions of images should suffice.

After some years working, I can say, give the client what he wants,
just be sure to notify him about the problems and how idiot is such
animations.

If you have knowledge enough, make the code by yourself, frameworks
are a bunch of crap.

David Mark · Dec 19, 2008

It's an open source e-commerce.

After some years working, I can say, give the client what he wants,
just be sure to notify him about the problems and how idiot is such
animations.

Done competently, there shouldn't be any problems. Certainly it
doesn't need to be animated though (that's one more thing to get
wrong.)

If you have knowledge enough, make the code by yourself, frameworks
are a bunch of crap.

Absolutely. This thing is 50K of fantasy code to size an image. It
will only work in IE and a couple other browsers and these rubes are
actually trying to charge for licenses. (!)

Santander · Dec 19, 2008

here is default one, popup_image.php:

<?php
/*
$Id: popup_image.php 1739 2007-12-20 00:52:16Z hpdl $

osCommerce, Open Source E-Commerce Solutions
http://www.oscommerce.com

Copyright (c) 2003 osCommerce

Released under the GNU General Public License
*/

require('includes/application_top.php');

$navigation->remove_current_page();

$products_query = tep_db_query("select pd.products_name, p.products_image
from " . TABLE_PRODUCTS . " p left join " . TABLE_PRODUCTS_DESCRIPTION . "
pd on p.products_id = pd.products_id where p.products_status = '1' and
p.products_id = '" . (int)$HTTP_GET_VARS['pID'] . "' and pd.language_id = '"
.. (int)$languages_id . "'");
$products = tep_db_fetch_array($products_query);
?>
<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">
<html <?php echo HTML_PARAMS; ?>>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<?php echo
CHARSET; ?>">
<title><?php echo $products['products_name']; ?></title>
<base href="<?php echo (($request_type == 'SSL') ? HTTPS_SERVER :
HTTP_SERVER) . DIR_WS_CATALOG; ?>">
<script language="javascript"></script>
</head>
<body onLoad="resize();">
<?php
echo tep_image(DIR_WS_IMAGES . $products['products_image'],
$products['products_name']);
?>
</body>
</html>
<?php require('includes/application_bottom.php'); ?>

-----------------
S.

It's an open source e-commerce.

After some years working, I can say, give the client what he wants,
just be sure to notify him about the problems and how idiot is such
animations.

Done competently, there shouldn't be any problems. Certainly it
doesn't need to be animated though (that's one more thing to get
wrong.)

If you have knowledge enough, make the code by yourself, frameworks
are a bunch of crap.

Absolutely. This thing is 50K of fantasy code to size an image. It
will only work in IE and a couple other browsers and these rubes are
actually trying to charge for licenses. (!)

David Mark · Dec 19, 2008

here is default one, popup_image.php:

<?php
/*
$Id: popup_image.php 1739 2007-12-20 00:52:16Z hpdl $

osCommerce, Open Source E-Commerce Solutions
http://www.oscommerce.com

Another world-beater framework.

Copyright (c) 2003 osCommerce

And never updated?

Released under the GNU General Public License
*/

require('includes/application_top.php');

$navigation->remove_current_page();

$products_query = tep_db_query("select pd.products_name, p.products_image
from " . TABLE_PRODUCTS . " p left join " . TABLE_PRODUCTS_DESCRIPTION . "
pd on p.products_id = pd.products_id where p.products_status = '1' and
p.products_id = '" . (int)$HTTP_GET_VARS['pID'] . "' and pd.language_id= '"
. (int)$languages_id . "'");
$products = tep_db_fetch_array($products_query);
?>

Don't post PHP here.

<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">

That about says it all.

<html <?php echo HTML_PARAMS; ?>>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<?php echo
CHARSET; ?>">
<title><?php echo $products['products_name']; ?></title>
<base href="<?php echo (($request_type == 'SSL') ? HTTPS_SERVER :
HTTP_SERVER) . DIR_WS_CATALOG; ?>">
<script language="javascript"><!--
Predictable.

var i=0;
function resize() {
if (navigator.appName == 'Netscape') i=40;
if (document.images[0]) window.resizeTo(document.images[0].width +30,
document.images[0].height+60-i);

Insanity.

[snip]

Gregor Kofler · Dec 19, 2008

Santander meinte:

$navigation->remove_current_page();

$products_query = tep_db_query("select pd.products_name,
p.products_image from " . TABLE_PRODUCTS . " p left join " .
TABLE_PRODUCTS_DESCRIPTION . " pd on p.products_id = pd.products_id
where p.products_status = '1' and p.products_id = '" .
(int)$HTTP_GET_VARS['pID'] . "' and pd.language_id = '" .
(int)$languages_id . "'");
$products = tep_db_fetch_array($products_query);

Well, it's OT, but it always beats me, how such utter crap can turn into
"widely used solutions" - whoever wrote this embarrassing piece of
"code" has no clue of both efficient PHP and proper (My)SQL, too. Not to
speak of best-practice guarding against injections (but I suppose since
it's e-commerce solution, such things are of little importance...).

Gregor

Santander · Dec 19, 2008

Just tested the mentioned "Highslide" javascript on Firefox 2,3 and Internet
Explorer 6, works flawlessly on both. Dont see what "wrong" is in that
widely used script, its very handy and nice.

S.
--------------------

here is default one, popup_image.php:

<?php
/*
$Id: popup_image.php 1739 2007-12-20 00:52:16Z hpdl $

osCommerce, Open Source E-Commerce Solutions
http://www.oscommerce.com

Another world-beater framework.

Copyright (c) 2003 osCommerce

And never updated?

Released under the GNU General Public License
*/

require('includes/application_top.php');

$navigation->remove_current_page();

$products_query = tep_db_query("select pd.products_name, p.products_image
from " . TABLE_PRODUCTS . " p left join " . TABLE_PRODUCTS_DESCRIPTION . "
pd on p.products_id = pd.products_id where p.products_status = '1' and
p.products_id = '" . (int)$HTTP_GET_VARS['pID'] . "' and pd.language_id =
'"
. (int)$languages_id . "'");
$products = tep_db_fetch_array($products_query);
?>

Don't post PHP here.

<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">

That about says it all.

<html <?php echo HTML_PARAMS; ?>>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<?php echo
CHARSET; ?>">
<title><?php echo $products['products_name']; ?></title>
<base href="<?php echo (($request_type == 'SSL') ? HTTPS_SERVER :
HTTP_SERVER) . DIR_WS_CATALOG; ?>">
<script language="javascript"><!--
Predictable.

var i=0;
function resize() {
if (navigator.appName == 'Netscape') i=40;
if (document.images[0]) window.resizeTo(document.images[0].width +30,
document.images[0].height+60-i);

Insanity.

[snip]

David Mark · Dec 19, 2008

Just tested the mentioned "Highslide" javascript on Firefox 2,3 and Internet
Explorer 6, works flawlessly on both. Dont see what "wrong" is in that
widely used script, its very handy and nice.

Those results are meaningless. You could have saved time by not
testing an obviously inept script. At the very least, you could have
tested it in an agent that is not explicitly sniffed for in the
script. What did you think you were testing?

And whether or not this is a "widely used" script or not (doubtful),
it is still 50K of rubbish to change and size an image. If you decide
you want to move the image, do you add another "handy" 50K? Don't you
think the next addition will have similar botched wrappers for gEBI,
opacity, etc.? This is how you end up with a 500K site that looks
like 50K.

S.
--------------------

here is default one, popup_image.php:

Click to expand...

<?php
/*
$Id: popup_image.php 1739 2007-12-20 00:52:16Z hpdl $

Click to expand...

osCommerce, Open Source E-Commerce Solutions
http://www.oscommerce.com

Click to expand...

Another world-beater framework.

Copyright (c) 2003 osCommerce

Click to expand...

And never updated?

Released under the GNU General Public License
*/

require('includes/application_top.php');

Click to expand...

$navigation->remove_current_page();

Click to expand...

$products_query = tep_db_query("select pd.products_name, p.products_image
from " . TABLE_PRODUCTS . " p left join " . TABLE_PRODUCTS_DESCRIPTION .. "
pd on p.products_id = pd.products_id where p.products_status = '1' and
p.products_id = '" . (int)$HTTP_GET_VARS['pID'] . "' and pd.language_id =
'"
. (int)$languages_id . "'");
$products = tep_db_fetch_array($products_query);
?>

Click to expand...

Don't post PHP here.

<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">

Click to expand...

That about says it all.

<html <?php echo HTML_PARAMS; ?>>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<?phpecho
CHARSET; ?>">
<title><?php echo $products['products_name']; ?></title>
<base href="<?php echo (($request_type == 'SSL') ? HTTPS_SERVER :
HTTP_SERVER) . DIR_WS_CATALOG; ?>">
<script language="javascript"><!--
Predictable.

var i=0;
function resize() {
if (navigator.appName == 'Netscape') i=40;
if (document.images[0]) window.resizeTo(document.images[0].width +30,
document.images[0].height+60-i);

Click to expand...

Insanity.

[snip]

Thomas 'PointedEars' Lahn · Dec 19, 2008

Santander said:
Just tested the mentioned "Highslide" javascript on Firefox 2,3 and
Internet Explorer 6, works flawlessly on both.

You are in no position to make such an assessment.

Dont see what "wrong" is in that widely used script, its very handy
and nice.

Whether it is widely used and if so, by whom, remains to be seen.
As for its flaws, some highlights:

- Browser sniffing (on navigator.userAgent)
- Misuse of the reserved `$' prefix in identifiers
- Complete lack of feature testing
- Use of implied global `self'
- Disregard for paddings, borders and margins when computing the
absolute element position
- exception handling without fallback
- lack of braces for conditional statements
- init() method instead of constructor
- `href="javascript:"' without `onclick' attribute/property in generated
`a' element
- Use of attachEvent() followed by detachEvent() as the equivalent of
addEventListener(); use of an `on...' event-handler property as the
equivalent of the latter
- `top: -9999px' to hide an element
- Use of document.readyState instead of a `load' event listener to set
a property
- Allows the luser to attempt blocking the image context menu
- `max-width: 9999px'
- Use of unqualified setTimeout()
- Unhandled assignment to window.location.href, known to be subject to
the SOP
- Use of uppercase element type identifiers (XHTML requires lowercase,
HTML supports both)
- Pointless object inference (window.opera)
- Unobtrusive JavaScript
- Using `window.onload' to handle the `load' event of `document.body'
- size: 48'601 bytes (ca. 47 KiB), uncompressed
- size: 24'349 bytes (ca. 24.3 KiB) minified,
using eval(function(p,a,c,k,e,d)...)

Take your pick.

PointedEars

Thomas 'PointedEars' Lahn · Dec 19, 2008

Thomas said:
- size: 48'601 bytes (ca. 47 KiB), uncompressed
- size: 24'349 bytes (ca. 24.3 KiB) minified,
using eval(function(p,a,c,k,e,d)...)

For the latter for some reasen I relied on what the Web site said
(bad idea). It's actually

- size: 24'349 bytes (ca. 23 KiB) minified,
using eval(function(p,a,c,k,e,d)...)

PointedEars

Santander · Dec 19, 2008

As to "big" size, I think this not an issue, nowadays most people on
broadband, so scripts loads instantly. Again, it works very well, tested on
Firefox2,3; MSIE6.

Did you know some better professional thumbnail viewer script for
osCommerce, that works the same way(visually)?

I just find this:
http://www.huddletogether.com/projects/lightbox/

Dont know, is this something better?

Santander

Thomas 'PointedEars' Lahn · Dec 19, 2008

Santander said:
As to "big" size, I think this not an issue, nowadays most people on
broadband, so scripts loads instantly. Again, it works very well,
tested on Firefox2,3; MSIE6.

And again, because you are not experienced enough to understand the
shortcomings it has, and thus cannot test the relevant Worst Cases,
you are in no position to make an educated assessment. "It works
in my browsers" has never been a mark of good production quality.

For example, JFYI: Because the script employs browser sniffing and no
feature testing at all, it is already likely that it won't work
unchanged in any other operating system, browser and browser version
than you superficially tested.

This, if not anything at all, should give you pause because you would
want your commercial (and in this case: e-commerce) Web site to work
both for other people than you, paying customers, and you would want it
to work in the foreseeable future without avoidable maintenance costs.

And JFTR: If you have tested with IE 6, you have tested with a
seven-year old, outdated and inherently flawed browser that has an
estimated 20% market share by now (already less than Firefox if the
trend continues for December), so that does not mean much.

Did you know some better professional thumbnail viewer script

Yes, my own.

for osCommerce,

Doesn't matter.

that works the same way(visually)?

I have not seen a working example yet.

I just find this:
http://www.huddletogether.com/projects/lightbox/

Dont know, is this something better?

It's probably worse as it requires another cluelessly written,
monolithic 30K+ library, Prototype.js.

[Top post]

Please learn to quote properly, there are plenty of examples in this thread.

PointedEars

Santander · Dec 19, 2008

Thomas 'PointedEars' Lahn said:
And again, because you are not experienced enough to understand the
shortcomings it has, and thus cannot test the relevant Worst Cases,
you are in no position to make an educated assessment. "It works
in my browsers" has never been a mark of good production quality.

But I do not need to be too much experienced and educated to understand that
script works, and works not bad.

Yes, my own.

Let me test your famous script?

Santander

Background animation infinite zoom-in zoom-out	0	Jul 1, 2022
Mandlebrot set web surfing	0	Sep 13, 2021
I need help making a zooming function	11	Dec 14, 2021
I Need Help with making a function that draws in a canvas using location data.	1	Dec 17, 2021
Simple web framework - improvements to makefile	0	Feb 1, 2023
Javascript for the Zoom in image	6	Jul 28, 2008
Help with datascraping script	1	Aug 26, 2024
Detecting Browser Zoom ?	0	Aug 26, 2008

Zoom script

Santander

Jonas Raoni Soares Silva

David Mark

Santander

David Mark

Santander

David Mark

Jonas Raoni Soares Silva

Santander

David Mark

Santander

David Mark

Gregor Kofler

Santander

David Mark

Thomas 'PointedEars' Lahn

Thomas 'PointedEars' Lahn

Santander

Thomas 'PointedEars' Lahn

Santander

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads